Perguntas com a marcação «canvas»

Canvas é um termo genérico para a superfície de desenho usada com muitas APIs de saída de gráficos de forma livre. Use esta tag com outras tags que indicam a API gráfica específica que está sendo usada junto com a linguagem de programação e o ambiente de destino: [android], [uwp], [wpf], [tkinter], [java], [html5], [chart.js] etc. etc. Inclua também uma tag de tela específica, como [android-canvas], [html5-canvas], [tkinter-canvas], se apropriado.

10
Qual é a diferença entre SVG e HTML5 Canvas?
Quais são as diferenças entre SVG e HTML5 Canvas? Ambos parecem fazer o mesmo comigo. Basicamente, ambos desenham arte vetorial usando pontos de coordenadas. o que estou perdendo? Quais são as principais diferenças entre o SVG e o HTML5 Canvas? Por que devo escolher um em vez do outro?
92 html  canvas  svg 
10
Por que canvas.toDataURL () lança uma exceção de segurança?
Não dormi o suficiente ou o quê? Este código a seguir 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")); } está gerando este erro: SECURITY_ERR: DOM Exception 18 Não tem como isso não …
8
Redimensionar imagem com tela javascript (suavemente)
Estou tentando redimensionar algumas imagens com tela, mas não tenho a menor ideia de como suavizá-las. No photoshop, navegadores, etc. existem alguns algoritmos que eles usam (por exemplo, bicúbico, bilinear), mas não sei se eles são integrados ao canvas ou não. Aqui está meu violino: http://jsfiddle.net/EWupT/ var canvas = document.createElement('canvas'); …
2
Dados PNG Base64 para tela HTML5
Quero carregar uma imagem PNG codificada em Base64 para o elemento canvas. Eu tenho este código: <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> No Chrome 8, recebo o erro: Uncaught TypeError: Type …
90 html  canvas  png  base64 
13
Redimensionar tela Chart.js
Em ( erro de tela do Android WebView HTML5 ), postei uma pergunta sobre plotagem de gráficos usando a biblioteca Graph.js. O problema que tenho agora é que, se eu chamar a função para plotar o gráfico várias vezes, a tela será redimensionada todas as vezes. Cada vez que o …
86 html  canvas  chart.js 
9
Obtenha a cor do pixel da tela, no movimento do mouse
É possível obter o pixel de valor RGB sob o mouse? Existe um exemplo completo disso? Aqui está o que tenho até agora: 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, …
4
Como detectar quando o mouse está fora de um determinado círculo?
Quando um mouse está pairando uma imagem. Ele é detectado por esta instrução if: if ((distance(circles[this.index].x, circles[this.index].y, mouse.x, mouse.y)) < circles[this.index].radius) Também quero detectar quando um mouse está fora de uma imagem. Após essa instrução if anterior, não posso usar mais o motivo: Quando gero várias imagens na tela e …
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.