Most voted "canvas" questions
Canvas is an HTML5 element intended to delimit an area for dynamic graphics rendering. All work of creation and animation is carried out through languages of dynamic programming, for example Javascript.
Learn more…209 questions
Sort by count of
-
43
votes2
answers6588
viewsHow can I pause and play a gif?
I want to put on my site, a system like 9gag, where people can pause and give play in a .gif. I know I have to use two images, one .jpg and a .gif, but tried some functions and could not. I found…
-
11
votes1
answer1271
viewsWebgl, Canvas and 3D Graphics
To Webgl (Web Graphics Library) is a Javascript API, available from the new HTML5 canvas element, which supports 2D graphics rendering and 3D graphics. Is there a difference between Webgl and Canvas…
-
11
votes1
answer1015
viewsCalculations used to rotate an image on canvas
I have the following code below to be able to rotate an image through the canvas. function qs(selector) { return document.querySelector(selector); } function rotacionar(canvas, image, angle) {…
javascript mathematics canvas image-processing rotationasked 7 years, 8 months ago Wallace Maxters 102,340 -
10
votes2
answers6917
viewsHow to clean a canvas area?
I created a function that generates random objects in the area canvas and wanted that after the end of this function the area was clean. Is there any possibility of doing that?…
-
9
votes1
answer1350
viewsMove the character in the canvas and change image
Well, I would like to know how I could implement a Sprite on my canvas, I am very lay with canvas, the idea is, when pressing arrow -> he runs Sprite 1.png, when pressing arrow <- he runs…
-
8
votes1
answer534
viewsRotate an arrow on a canvas
I need to draw a flow dynamically based on a few user choices. In this flow I want to draw the chosen hypotheses (blue circles with numbers) and the direction between the choices (lines with…
-
8
votes1
answer5630
viewsWriting on Javascript screen
I need to make an area in the form that the user digitally signs with a touch screen pen to store their signature. As if the same was writing on a paper but on screen. I read about Canvas but only…
-
8
votes2
answers1082
viewsCollision system for game in Html5!
I’m learning a little about games in Html5,css and js. I made a very basic game, player drive, enemy and a collision system, see: var canvas;//o elemento canvas sobre o qual desenharemos var ctx;//o…
-
7
votes4
answers1249
viewsWhat is the <canvas> tag for?
I was researching some information and saw that there is a tag called <canvas> in HTML5. What does the canvas tag? It only serves to make geometric shapes? If possible and feasible, could give…
-
6
votes1
answer1855
viewsEquation solving
I created a Cartesian plan and I get an equation from the user. My goal is to draw this equation in the plane. I’m doing this using canvas. Only here comes a problem, I can only do this if I…
-
6
votes1
answer5665
viewsResize an image in a canvas element with js
Problem Image resizing with Javascript Possible solution Use the widget canvas to redesign the image, resize it and then render the image again. Below will be cited 2 cases of use merely…
-
6
votes2
answers622
viewsCanvas delete correct text
I do research and there is no way to make it work, the first try works well, but the second no longer, that is, it does not erase the text that was there and replace it with the new one (in the…
-
5
votes1
answer200
viewsGet widget without id
I have a div, and within it one canvas without id and other elements. <div id="itens"> ... <canvas></canvas> ... </div> How can I get the canvas using JQuery?…
-
5
votes1
answer73
viewsFade Radial js or canvas
Hello, I wonder if there is some transition I can do in radial or style of dissolving paint (as if it were running paint)? For this purpose become cooler to open the site. Fiddle:…
-
5
votes1
answer182
viewsCan you calculate the diagonal on canvas?
I need to draw a square with Canvas in an image. This image comes from the database, where it has different dimensions. I’m able to draw the square in the center of the image, but if the image is…
-
5
votes1
answer45
viewsSetting up an arena in canvas
I’m setting up an arena using HTML/JS with the canvas. I have the following code: function montarArena() { var canvas; var heightCanvas = 498; var widthCanvas = 598; var qtdLinhas =…
-
5
votes2
answers2626
viewsAdjust image inside canvas
I have a page that allows you to insert an image inside the canvas element and works perfectly. Now, what I need is a way to limit the positioning of the image within the canvas, not allowing it to…
-
4
votes2
answers581
viewsLocation of a point within the arc range
I’m looking for a Javascript function that returns a random value within a range in the area of a circle. The interval would be along the radius with distances equivalent to the center point and the…
-
4
votes2
answers786
viewsHow to update the canvas?
On a canvas, I added 10 small squares, but I also want to be able to change the position of these squares continuously, and that change be drawn on the screen whenever I do (I don’t necessarily need…
-
4
votes1
answer1985
viewsHow to insert a water mark in png
Following this example, I would like to be able to use a png in place of the tracks made on the canvas: https://github.com/baivong/Celebrate-Pride-Canvas I’m using this code as a study, because it’s…
-
4
votes1
answer287
viewsWorking with Canvas - No Edge
I have a canvas on my page and would like to remove the edge.... only I’m not getting... which property works with the edge? function desenhaBase(canvas, context, x1, y1, x2, y2){ context.fillStyle…
-
4
votes2
answers1201
viewsModify Canvas in real time
How can I use the tag canvas HTML5 and make this change in real time as I input the data into input? I’ve already done the form and put the tag canvas page. I was wondering if JQuery it is possible…
-
4
votes1
answer235
viewsImage smaller than the original canvas upup when drawImage()
I am developing a system to filter images with canvas Html5, however, as I am at the beginning, I have already had some doubts and errors. At this "start" I want the canvas size to be equal to the…
-
4
votes1
answer1152
viewsAxes of a Cartesian plane changing according to the HTML5(canvas) + JAVASCRIPT zoom
Guys, here’s the thing, I’m doing it with js + html5 and canvas a program to plot graphics: I would like to implement a zoom + and -, as in the image, and return to the original zoom by clicking…
-
4
votes1
answer908
viewsCheck area size on Canvas
I have a code that when opening the report information, is created in Canvas a rectangle on top of each image. However, these images have different sizes, but the canvas remains the same size. I…
-
4
votes1
answer1027
viewsJavascript canvas button builder
I have a question when creating a button builder for Canvas in JS, I can already detect the click in the button area, but I would like to simplify the code with a constructor, to speed up my content…
-
4
votes0
answers818
viewsImage Resolution created with canvas
Good afternoon to all! I’m developing an application that scans a multi-digital file, where it is possible for the user to make cuts to these fingerprints and then save them to the BLOB database. To…
-
4
votes1
answer3271
viewsIs it possible to save the canvas as an image, and send it to the server?
Let’s say I have a code that looks like this: <html> <head> <style> .centralizado { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); } </style>…
-
4
votes1
answer296
viewsDynamic graph does not update
I’m using the library Rgraph graphics HTML5, and should update dynamically together with the bank. However, I would like the last data imputed in the bank to be placed on the chart, so if I inserted…
-
4
votes1
answer1221
viewsTake values from a table and place in an HTML graph
I made a database and this is feeding a table. I wonder how it would be to take such table data and plot on a graph. In the code below is already the graph with fictitious values. <! DOCTYPE html…
-
4
votes2
answers5448
viewsIs it possible to mirror an image horizontally (flip) with Canvas?
I know it’s possible to mirror horizontally <img> with CSS, but wanted to know if it is possible to mirror an image horizontally inside a canvas. With CSS, I would do like this: #img-flip{…
-
4
votes1
answer109
viewsTrajectory of an object using canvas in javascript
The question is this, I was able to develop the exercise to a certain extent, after that, as I do not know much of javascript, if I send the square back diagonally, the square comes back earlier due…
-
4
votes2
answers48
viewsHow to pass Corner Blob effect to right side of the screen?
I would like to reverse the effect demonstrated by starting from the right side of the screen and expanding to the left side, however, I did not achieve this. Someone could give me a light? const…
-
3
votes1
answer473
viewsDraw same javascript object on different canvas
I created a standardized function to speed up the design process in a multiple canvas project. I appreciate the collaboration of bfavaretto /users/74/bfavaretto See function: (it works correctly)…
-
3
votes1
answer108
viewsWhat tools to use to create WEB games?
I would like your help in the following questions: 1. What better option for web game development ? 2. HTML5 with Canvas, Javascript and PHP ? What do you think of this combination ? 3. Python is an…
-
3
votes1
answer65
viewsReference not found for object property
I developed a simple code of particles in codepen.io and its execution generates a log with the error: Uncaught TypeError: Cannot read property 'color' of undefined What is the reason for the error?…
-
3
votes2
answers637
viewsConvert Html to Canvas
Is it possible to convert an html page to canvas? For example, I have a page built in Html5 and wanted this page to be all "minified" for just one tag ? I don’t want the html page to become an…
-
3
votes2
answers390
viewsDelphi Triangle - Canvas
I want to draw a triangle in Delphi through the Canvas. This pointer will serve as a pointer to a Gauge (Speedometer) as in this example: I use the TPoint() to define where the pointer will point. I…
-
3
votes2
answers1153
viewsAdd a bmp or jpg figure to a canvas in Delphi
It is possible to insert, via programming, a jpg or bmp image on a canvas? I am using the canvas in a Tbitmap at programming time because my application has no screen. It is called, creates the…
-
3
votes1
answer428
viewsToast is not being shown
I tried to search several sources, but I still don’t understand why Toast class DrawView is not displayed when I click on the screen. Any idea? public class MyActivity extends Activity{ public…
-
3
votes1
answer1791
viewsHow to make an animation by replacing images
Has a browser game on the internet it has a feature that I found interesting and would like to know how to do. As you can see in the picture, there are some buildings, some objects and some people!…
-
3
votes1
answer1333
viewsjavascript zoom function
I would like to create a zoom function inside a js extension file, I already have a canvas function, however in my drawing is coming out very small depending on the initial coordinates, so I would…
-
3
votes1
answer165
viewsIs there any way to manipulate the brightness of the image through Canvas?
I am developing a system where the user can make small adjustments in images, and can rotate and cut currently. Before this whole part was being done through coordinates, where I sent the parameters…
-
3
votes0
answers94
viewsWebcam Canvas - Zoom
Is there any way, a command that will allow me to change the webcam zoom ? In this code below is where I create my Webcam canvas for Snapshot on the site. I want to apply - zoom, ie increase the…
-
3
votes1
answer1777
viewsHow to delete a specific object in HTML5 canvas?
Good, for example I have two rectangles drawn on the canvas: const canvas = document.getElementById('canvas') const context = canvas.getContext('2d'); context.fillRect(20,20,150,100);…
-
3
votes1
answer110
viewsIs it possible to make a Picker color with canvas?
With the addition of canvas in HTML5, several possibilities have emerged, such as creating small games or even a meme generator. With that, I wonder if through the canvas it would be possible to…
-
3
votes1
answer1144
viewsResize Canvas Chart
I’m using Chartjs and I have a radar graph. See the code below: Also have that fiddle. var radarChartData = { labels: ["Item1", "Item2", "Item3", "Item4"], datasets: [ { label: "Linha1", fillColor:…
-
3
votes1
answer164
viewsScrolling of Tiledmap
I’m trying to build a camera system for a game that I intend to do in pure javascript, but I can’t produce the effect correctly. If anyone can see and fix it or guide me to read some tutorial would…
-
3
votes1
answer199
viewsImage loses effect of Camanjs when manipulating canvas
I have a canvas, in which I manipulate images drawn on it with the plugin Camanjs and works perfectly. However, if I manipulate the canvas manually (without the help of the plugin) the image loses…
-
3
votes1
answer373
viewsForce extension appear when downloading via javascript
I have this screen, image resizing: when I click download, this screen appears to save the file, but as you can see, the file appears without the extension, how can I make the file appear with the…