Вопросы с тегом «canvas»

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

9
Ограничение количества меток на линейном графике Chart.js
Я хочу отобразить все точки на моей диаграмме из полученных данных, но я не хочу отображать для них все метки, потому что тогда диаграмма не очень удобочитаема. Я искал это в документации, но не смог найти ни одного параметра, который ограничивал бы это. Я не хочу брать для примера только …
10
В чем разница между SVG и HTML5 Canvas?
В чем разница между SVG и HTML5 Canvas? Кажется, они оба поступают со мной одинаково. По сути, они оба рисуют векторные изображения с помощью координатных точек. Что мне не хватает? В чем основные различия между SVG и HTML5 Canvas? Почему я должен выбирать одно вместо другого?
92 html  canvas  svg 
5
Как заполнить весь холст определенным цветом
Как заполнить весь HTML5 <canvas>одним цветом. Я видел некоторые решения, подобные этому, для изменения цвета фона с помощью CSS, но это не очень хорошее решение, поскольку холст остается прозрачным, единственное, что изменяется, - это цвет занимаемого пространства. Другой - создать что-то с цветом внутри холста, например прямоугольник ( см. Здесь …
8
Изменить размер изображения с помощью холста javascript (плавно)
Я пытаюсь изменить размер некоторых изображений с помощью холста, но не знаю, как их сгладить. В фотошопе, браузерах и т. Д. Они используют несколько алгоритмов (например, бикубический, билинейный), но я не знаю, встроены они в холст или нет. Вот моя скрипка: http://jsfiddle.net/EWupT/ var canvas = document.createElement('canvas'); var ctx = canvas.getContext('2d'); …
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 Это не должно работать! Кто-нибудь может объяснить это, пожалуйста?
2
Данные PNG Base64 в холст HTML5
Я хочу загрузить изображение PNG, закодированное в Base64, в элемент холста. У меня есть такой код: <html> <head> </head> <body> <canvas id="c"></canvas> <script type="text/javascript"> var canvas = document.getElementById("c"); var ctx = canvas.getContext("2d"); data = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAIAAAACDbGyAAAAAXNSR0IArs4c6QAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9oMCRUiMrIBQVkAAAAZdEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRoIEdJTVBXgQ4XAAAADElEQVQI12NgoC4AAABQAAEiE+h1AAAAAElFTkSuQmCC"; ctx.drawImage(data, 0, 0); </script> </body> </html> В Chrome 8 появляется ошибка: Uncaught TypeError: Type error …
89 html  canvas  png  base64 
3
Отключить прокрутку клавиш со стрелками в браузере пользователей
Я делаю игру, используя холст и javascript. Когда страница длиннее экрана (комментарии и т. Д.), Нажатие стрелки вниз прокручивает страницу вниз и делает игру невозможной. Что я могу сделать, чтобы окно не прокручивалось, когда игрок просто хочет спуститься вниз? Я полагаю, что с играми Java и т.п. это не проблема, …
13
Изменение размера холста Chart.js
В ( Ошибка холста HTML5 Android WebView ) я разместил вопрос о построении графиков с использованием библиотеки 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) { …
5
Как сделать текст холста HTML5 жирным и / или курсивом?
Я печатаю текст на холсте довольно простым способом: var ctx = canvas.getContext('2d'); ctx.font = "10pt Courier"; ctx.fillText("Hello World", 100, 100); Но как изменить текст на полужирный, курсив или и то, и другое? Есть предложения по исправлению этого простого примера?
12
Поддерживает ли HTML5 / Canvas двойную буферизацию?
Я бы хотел нарисовать свою графику в буфере, а затем иметь возможность скопировать ее как есть на холст, чтобы я мог делать анимацию и избегать мерцания. Но я не нашел такой вариант. Кто-нибудь знает, как я могу это сделать?
11
как сохранить холст как изображение png?
У меня есть элемент холста с рисунком в нем, и я хочу создать кнопку, которая при нажатии сохранит изображение как файл png. Таким образом, он должен открыть диалоговое окно сохранения, открытия, закрытия ... Я делаю это с помощью этого кода var canvas = document.getElementById("myCanvas"); window.open(canvas.toDataURL("image/png")); Но когда я тестирую его …
1
Установка свойств холста в шаблоне данных ItemsControl
Я пытаюсь привязать к этому ItemsControl: <ItemsControl ItemsSource="{Binding Path=Nodes, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"> <ItemsControl.ItemsPanel> <ItemsPanelTemplate> <Canvas /> </ItemsPanelTemplate> </ItemsControl.ItemsPanel> </ItemsControl> Используя это DataTemplate, я пытаюсь правильно позиционировать свои Nodeэлементы на Canvas: <DataTemplate DataType="{x:Type Model:EndNode}"> <Controls:EndNodeControl Canvas.Left="{Binding Path=XPos}" Canvas.Top="{Binding Path=YPos}" /> </DataTemplate> Однако это работает не так, как ожидалось. Все мои нодовые элементы …
80 c#  wpf  xaml  canvas  itemscontrol 
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.