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

Полотно - це узагальнений термін для поверхні малювання, який використовується у багатьох вихідних інтерфейсах графічної графіки вільної форми. Використовуйте цей тег з іншими тегами, які вказують на конкретний графічний API, який використовується разом із мовою програмування та цільовим середовищем: [android], [uwp], [wpf], [tkinter], [java], [html5], [chart.js] тощо. Також включайте конкретний тег полотна, такий як [android-canvas], [html5-canvas], [tkinter-canvas], якщо це доречно.

9
Обмежте кількість міток на лінійній діаграмі Chart.js
Я хочу відображати всі точки на своїй діаграмі з отриманих даних, але не хочу відображати всі мітки для них, оскільки тоді діаграма не дуже читається. Я шукав це в документації, але не міг знайти жодного параметра, який би обмежував це. Наприклад, я не хочу брати лише три мітки, оскільки тоді …
18
Малювання тексту в <canvas> за допомогою @ font-face спочатку не працює
Коли я малюю текст на полотні шрифтом, який завантажується через @ font-face, текст відображається неправильно. Він взагалі не відображається (у Chrome 13 та Firefox 5), або шрифт неправильний (Opera 11). Цей тип несподіваної поведінки виникає лише при першому малюванні на гарнітурі. Потім все працює нормально. Це стандартна поведінка чи щось …
93 html  canvas  font-face 
10
У чому різниця між SVG та HTML5 Canvas?
Які відмінності між SVG та HTML5 Canvas? Здається, вони обидва роблять те саме зі мною. В основному, вони обидва малюють векторні ілюстрації за допомогою координатних точок. Чого мені не вистачає? Які основні відмінності між SVG та HTML5 Canvas? Чому я повинен вибрати одне над іншим?
92 html  canvas  svg 
5
Як залити все полотно певним кольором
Як залити весь &lt;canvas&gt;колір HTML5 одним кольором. Я бачив деякі рішення , такі як це , щоб змінити колір фону з допомогою CSS , але це не є хорошим рішенням , оскільки полотно залишається прозорим, єдине , що зміни кольору простору , яке він займає. Інший - це створити щось …
10
Чому canvas.toDataURL () видає виняток безпеки?
Я не виспався чи що? Цей наступний код var frame=document.getElementById("viewer"); frame.width=100; frame.height=100; var ctx=frame.getContext("2d"); var img=new Image(); img.src="http://www.ansearch.com/images/interface/item/small/image.png" img.onload=function() { // draw image ctx.drawImage(img, 0, 0) // Here's where the error happens: window.open(frame.toDataURL("image/png")); } викидає цю помилку: SECURITY_ERR: DOM Exception 18 Це ніяк не може спрацювати! Хто-небудь може пояснити це, …
8
Змінити розмір зображення за допомогою полотна javascript (плавно)
Я намагаюся змінити розмір деяких зображень на полотні, але не знаю, як їх згладити. У Photoshop, браузерах і т. Д. Існує кілька алгоритмів, які вони використовують (наприклад, бікубічний, білінійний), але я не знаю, вбудовані вони в полотно чи ні. Ось моя скрипка: http://jsfiddle.net/EWupT/ var canvas = document.createElement('canvas'); var ctx = …
2
Дані Base64 PNG на полотно HTML5
Я хочу завантажити зображення PNG, закодоване в Base64, у елемент полотна. У мене є такий код: &lt;html&gt; &lt;head&gt; &lt;/head&gt; &lt;body&gt; &lt;canvas id="c"&gt;&lt;/canvas&gt; &lt;script type="text/javascript"&gt; var canvas = document.getElementById("c"); var ctx = canvas.getContext("2d"); data = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAIAAAACDbGyAAAAAXNSR0IArs4c6QAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9oMCRUiMrIBQVkAAAAZdEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRoIEdJTVBXgQ4XAAAADElEQVQI12NgoC4AAABQAAEiE+h1AAAAAElFTkSuQmCC"; ctx.drawImage(data, 0, 0); &lt;/script&gt; &lt;/body&gt; &lt;/html&gt; У Chrome 8 я отримую помилку: Uncaught TypeError: Type …
89 html  canvas  png  base64 
3
Вимкніть прокрутку клавіш зі стрілками в браузері користувачів
Я роблю гру за допомогою полотна та javascript. Якщо сторінка довша за екран (коментарі тощо), натискання стрілки вниз прокручує сторінку вниз і робить гру неможливою. Що я можу зробити, щоб вікно не прокручувалося, коли гравець просто хоче рухатися вниз? Я думаю, що з іграми Java, і такими, це не проблема, …
13
Змінення розміру полотна Chart.js
У ( Помилка полотна Android WebView HTML5 ) я опублікував запитання щодо побудови графіків за допомогою бібліотеки Graph.js. Проблема, яку я маю зараз, полягає в тому, що якщо я викликаю функцію для побудови графіку кілька разів, полотно кожного разу змінюється. Щоразу, коли графік перемальовується на одне і те ж полотно, …
86 html  canvas  chart.js 
9
Отримайте кольори пікселів із полотна на ході миші
Чи можна отримати піксель значення RGB під мишею? Чи є повний приклад цього? Ось що я маю на сьогодні: function draw() { var ctx = document.getElementById('canvas').getContext('2d'); var img = new Image(); img.src = 'Your URL'; img.onload = function(){ ctx.drawImage(img,0,0); }; canvas.onmousemove = function(e) { var mouseX, mouseY; if(e.offsetX) { mouseX …
4
Як я можу оформити текст полотна HTML5 жирним та / або курсивом?
Я друкую текст на полотні досить прямо вперед: var ctx = canvas.getContext('2d'); ctx.font = "10pt Courier"; ctx.fillText("Hello World", 100, 100); Але як я можу змінити текст на напівжирний, курсив або обидва? Будь-які пропозиції, щоб виправити цей простий приклад?
12
Чи підтримує HTML5 / Canvas подвійну буферизацію?
Що я хотів би зробити, це намалювати свою графіку на буфері, а потім мати можливість скопіювати її як є на полотно, щоб я міг робити анімацію та уникати мерехтіння. Але я не міг знайти цей варіант. Хтось знає, як я можу про це піти?
6
Html5 canvas drawImage: як застосувати згладжування
Будь ласка, подивіться на наступний приклад: http://jsfiddle.net/MLGr4/47/ var canvas = document.getElementById("canvas"); var ctx = canvas.getContext("2d"); img = new Image(); img.onload = function(){ canvas.width = 400; canvas.height = 150; ctx.drawImage(img, 0, 0, img.width, img.height, 0, 0, 400, 150); } img.src = "http://openwalls.com/image/1734/colored_lines_on_blue_background_1920x1200.jpg"; Як бачите, зображення не згладжується, хоча кажуть, що drawImage …
16
Як намалювати овал на полотні html5?
Здається, немає власної функції для малювання овальної форми. Також я не шукаю яєчну форму. Чи можна намалювати овал з 2 кривими Безьє? Хтось описував це? Моя мета - намалювати деякі очі, а насправді я просто використовую дуги. Заздалегідь спасибі. Рішення Тож масштаб () змінює масштаб для всіх наступних фігур. Зберегти …
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.