Articles of html5 canvas

очистить холст и сохранить холст

Я просто заканчиваю веб-приложение для анализа изображений и рисования. И мне нужна помощь с холстом. Вот что я делаю: РЕДАКТИРОВАТЬ: <img id="imgEdit" src="<?php echo $imagename; ?>" border="0"> <canvas id="canvasPaint" width="<?php echo $width; ?>" height="<?php echo $height; ?>"> </canvas> <input type="button" value="Clear" onClick="clearCanvas();" class="button"> <input type="button" value="Save" onClick="saveViaAJAX();" class="button"> <div id="debugFilenameConsole">Wait for a while after clicking […]

Изгиб изображения с помощью PHP или HTML5

Я ищу для достижения: http://i53.tinypic.com/2gule04.jpg Я попробовал ответы, упомянутые в Curving, изображение, которое начинается как прямоугольник (загружается пользователем), предпочтительно используя Canvas или JS Основываясь на ответах, я попытался преобразовать пиксельные мудры, которые не сработали. Чтобы понять подход на основе сетки, вам понадобится набор навыков разработчика 3d-2d, которого у меня нет. Я разработчик PHP, и я […]

dataurl to image для скачивания в php

Я создаю изображение с использованием холста и используя следующий скрипт, function getImage() { var canvas1 = document.getElementById("images"); if (canvas1.getContext) { var ctx = canvas1.getContext("2d"); var myImage = canvas1.toDataURL("image/jpg"); } $('<form action="download.php" method="POST">' + '<input type="hidden" name="aid" value="' + myImage + '">' + '</form>').submit(); } И в моем файле Download.php, <?php $img = $_POST['aid']; echo "<img […]

Преобразование div в загружаемое изображение

Это код, который я использую для преобразования div в изображение и загрузки, используя html2canvas.js <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script src="https://html2canvas.hertzen.com/build/html2canvas.js"></script> <style> #download{ margin:10% 40%; } .download-btn{ padding:10px; font-size:20px; margin:0 20px; } #test{ background:#3399cc; padding:50px; } .x2{ transform: scale(2,2); } </style> <div id="download"> <h1 id="test">Testing Download</h1> </div> <center> <button id="download-window" class="download-btn">New Window</button> <button id="download-png" class="download-btn">Download png</button> <button id="download-jpg" […]

Как нарисовать фигуру с помощью части изображения в php

Мне нужно создать образ кадра, используя кусок изображения. Например: Пользователь загрузит фрагмент изображения из исходного кода: Теперь мне нужно создать фрейм на front-end в соответствии с требованиями пользователя переднего плана (пользователь будет выбирать высоту и ширину рамки, а затем выбрать эту часть изображения) следующим образом: Я не получаю никакого способа сделать это, я попытался сделать […]

Как сохранить PNG-изображение на стороне сервера, из строки данных base64

Я использую инструмент JavaScript «Canvas2Image» от Nihilogic для преобразования рисунков холста в изображения PNG. Теперь мне нужно превратить те строки base64, которые этот инструмент генерирует, в фактические файлы PNG на сервере, используя PHP. Короче говоря, то, что я сейчас делаю, – это сгенерировать файл на стороне клиента с помощью Canvas2Image, а затем получить данные, закодированные […]

Как сохранить холст HTML5 как изображение на сервере?

Я работаю над генеративным арт-проектом, где я хотел бы разрешить пользователям сохранять полученные изображения из алгоритма. Общая идея: Создайте изображение на холсте HTML5 с помощью генеративного алгоритма Когда изображение будет завершено, разрешите пользователям сохранять холст в качестве файла изображения на сервере Разрешить пользователю либо загружать изображение, либо добавлять его в галерею частей, созданных с использованием […]

Какова наилучшая практика экспорта холста с высококачественными изображениями?

Мне нужна ваша помощь. Я объясняю свою ситуацию: я использую библиотеку fabric.js для размещения фигур, текста и т. Д. В своем приложении. Размер моего холста имеет 1000×1000 пикселей (около 26.45×26.45 сантиметров). У меня есть сценарий загрузки изображений только для загрузки изображений в высоком качестве, например, 300 dpi. В основном я делаю следующее: – нарисуйте холст […]