Запитання з тегом «html5-canvas»

Після експериментів із композиційними операціями та малюванням зображень на полотні я зараз намагаюся видалити зображення та композицію. Як це зробити? Мені потрібно очистити полотно для перемальовування інших зображень; це може тривати деякий час, тому я не думаю, що малювання нового прямокутника кожного разу буде найбільш ефективним варіантом.

1012 javascript  html  canvas  html5-canvas  composite 

Який найкращий підхід для створення елементів на льоту та можливість їх переміщення? Наприклад, скажімо, що я хочу створити прямокутник, коло та багатокутник, а потім виділити ці об’єкти і перемістити їх. Я розумію, що HTML5 пропонує три елементи, які можуть зробити це можливим: svg , canvas та div . Що я …

476 javascript  html  svg  html5-canvas 

Як я можу автоматично масштабувати <canvas>елемент HTML5 для розміщення сторінки? Наприклад, я можу отримати <div>масштаб, встановивши значення heightі widthвластивості на 100%, але <canvas>масштаб не буде, чи не так?

400 javascript  html  html5-canvas 

Я працюю над генеративним арт-проектом, де я хотів би дозволити користувачам зберігати отримані зображення з алгоритму. Загальна ідея: Створіть зображення на полотні HTML5 за допомогою генеративного алгоритму Коли зображення завершено, дозвольте користувачам зберігати полотно як файл зображення на сервері Дозвольте користувачу або завантажити зображення, або додати його в галерею фрагментів, …

260 javascript  php  ajax  html5-canvas 

Я хочу мати веб-сторінку з одним центрованим словом. Я хочу, щоб це слово було намальовано анімацією, щоб сторінка "записувала" слово так само, як і ми, тобто воно починається в один момент і малює лінії та криві з часом, так що кінцевим результатом є гліф. Мені все одно, чи це робиться …

229 javascript  css  canvas  html5-canvas  css-shapes 

Я використовую інструмент JavaScript "Canvas2Image" Nihilogic для перетворення малюнків полотна в зображення PNG. Що мені зараз потрібно - це перетворити ці рядки base64, які створює цей інструмент, у фактичні файли PNG на сервері, використовуючи PHP. Коротше кажучи, те, що я зараз роблю, - це генерувати файл на стороні клієнта за …

212 php  javascript  base64  html5-canvas 

Я хочу зберегти своє полотно в імг. Я маю цю функцію: function save() { document.getElementById("canvasimg").style.border = "2px solid"; var dataURL = canvas.toDataURL(); document.getElementById("canvasimg").src = dataURL; document.getElementById("canvasimg").style.display = "inline"; } Це дає мені помилку: Uncaught SecurityError: Не вдалося виконати "toDataURL" на "HTMLCanvasElement": Пошкоджені полотна можуть не експортуватися. Що я повинен зробити?

187 javascript  html5-canvas 

Фотографії цифрових фотоапаратів часто зберігаються у форматі JPEG із тегом EXIF ​​"орієнтація". Щоб правильно відобразити зображення, потрібно обертати / дзеркально відображати залежно від того, яка орієнтація встановлена, але браузери ігнорують цю інформацію, яка відображає зображення. Навіть у великих комерційних веб-додатках підтримка орієнтації EXIF ​​може бути помітною 1 . Це ж …

154 javascript  rotation  html5-canvas  exif 

Я використовую елементи полотна html5 для зміни розміру зображень у своєму браузері. Виявляється, якість дуже низька. Я виявив це: вимкнути інтерполяцію, коли масштабувати <canvas>, але це не сприяє підвищенню якості. Нижче мій код css та js, а також зображення, розширене за допомогою Photoshop та масштабування в полотні API. Що мені …

149 javascript  css  html  canvas  html5-canvas 

Для програми для малювання я зберігаю координати руху миші до масиву, а потім малюю їх з допомогою рядкаTo. Отримана лінія не є гладкою. Як я можу створити єдину криву між усіма зібраними точками? Я googled, але я знайшов лише 3 функції для малювання ліній: Для 2-х зразкових точок просто використовуйте …

133 javascript  canvas  html5-canvas  bezier  spline 

Мій код дуже добре працює на мій localhost, але він не працює на сайті. Я отримав цю помилку з консолі для цього рядка .getImageData(x,y,1,1).data: Uncaught SecurityError: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The canvas has been tainted by cross-origin data. частина мого коду: jQuery.Event.prototype.rgb=function(){ var x = this.offsetX || (this.pageX …

131 javascript  html  html5-canvas 

Я хотів би обертати фотографії на основі їх оригінального обертання, встановленого камерою в даних зображення JPEG EXIF. Хитрість полягає в тому, що все це повинно відбуватися в браузері, використовуючи JavaScript та<canvas> . Як JavaScript міг отримати доступ до JPEG, об’єкту API локального файлу, локального <img>або віддаленого <img>, EXIF-даних, щоб прочитати …

125 javascript  jpeg  exif  html5-canvas 

Я намагався змінити кольори тла мого полотна за замовчуванням на чорний на прозорий / будь-який інший колір, але не пощастило. Мій HTML: <canvas id="canvasColor"> Мій CSS: <style type="text/css"> #canvasColor { z-index: 998; opacity:1; background: red; } </style> Як ви бачите на наступному прикладі в Інтернеті, у мене на полотні додається …

122 css  html  canvas  html5-canvas  three.js 

Чи є якась причина, крім продуктивності, для використання WebGL замість 2D-Canvas для 2D ігор / додатків? Іншими словами, які 2D-функції пропонуються WebGL, яких неможливо легко досягти за допомогою 2D-Canvas?

112 html  html5-canvas  webgl 

Я намагаюся скласти два полотна разом і зробити це подвійним шаром полотна. Я бачив тут приклад: <div style="position: relative;"> <canvas id="layer1" width="100" height="100" style="position: absolute; left: 0; top: 0; z-index: 0;"></canvas> <canvas id="layer2" width="100" height="100" style="position: absolute; left: 0; top: 0; z-index: 1;"></canvas> </div> Але я хотів би встановити вирівнювання …

103 css  html5-canvas