What's the simplest way to add a click event handler to a canvas element that will return the x and y coordinates of the click (relative to the canvas element)? No legacy browser compatibility required, Safari, Opera and Firefox will do. Update: Thanks @Brian, the following is working (in Opera and FF3 at least): canvas.addEventListen...
I'm using the HTML5 <canvas> element in Firefox 2.0.0.16 and in Safari 3.1.2, both on my iMac. (I've tried this in Firefox 3.0 on Windows as well, also to no avail.) The tag looks like this: <td> <canvas id="display" width="500px" height="500px"> </canvas> </td> I have a button to "activate" some function...
I want to create some text in a canvas: myText = self.canvas.create_text(5, 5, anchor=NW, text="TEST") Now how do I find the width and height of myText? ...
How can I fetch images from a server? I've got this bit of code which allows me to draw some images on a canvas. <html> <head> <script type="text/javascript"> function draw(){ var canvas = document.getElementById('canv'); var ctx = canvas.getContext('2d'); for (i=0;i<document.images.length;i++){ ...
I keep reading about how great this new Canvas element for HTML5 is and I see amazing demos done with just javascript and no flash. Where can I find some good information on how to some of these things myself? ...
Hi! I am thinking about making a website with some fairly intense JavaScript/canvas usage and I have been looking at Processing.js and it seems to me that it would make manipulating the canvas significantly easier. Does anyone know any reasons why I shouldn't use Processing.js? I understand that older browsers won't be able to use it,...
I've created a web page that lets you input some information and then draws an image in a canvas element based on that info. I have it pretty much working the way I want except for the printing. Is there a way to print out the canvas element or is creating a new window to draw in, the only way to do it? Update: The answer was so simp...
I'm playing around with the <canvas> element, drawing lines and such. I've noticed that my diagonal lines are antialiased. I'd prefer the jaggy look for what I'm doing - is there any way of turning this feature off? ...
I'm looking for success and failure stories of web applications rendering rich, 2D graphics via the HTML canvas element. I've seen some intriguing examples online but wanted to learn about some real-world, practical examples of development done using this approach. ...
I have a simple GUI component written in Java. The class draws an analog clock in a java.awt.canvas. This canvas is then contained in a JFrame - What I want to do is give the canvas a 3d "raised" effect - almost like adding a drop shadow to a photo. Is there a simple way to do this? ...
Here is my problem: I have a main canvas 'blackboard' in a panel, this canvas has itself several childs, like a toolbar (tiles), a label and some skinning. The problem is that when i move to the rectangle tool and i start drawing rectangles if i want to change the tool when i click on an other tool such as 'circle' or 'select' the but...
Hi, Can anyone please tell me the issues that we face when using JCanvas3D instead of Canvas3D? How to achieve transparency using JCanvas3D? Regards, hariprasad ...
I have set a canvas' background to an image of a company logo. I would like for this image to be aligned to the bottom right corner of the canvas. Is it possible to do this, or would it require for the image to be added into the canvas as a child? That would not work with this program as all children of the canvas are handled different...
I'm using FlexBuilder 3. I love the way the layout guides tell you when a component you're placing on a canvas is so far from the next component (presumably 8 pixels). Is it possible to change the distance at which the ruler guide pops up? I'm putting a series of labels close together and would like to change this to, say, 4 pixels. ...
I can not figure out what all the parameters to the arc() function are (by experimentation) and I have not found any tutorial that seems to explain them. Where would a good explanation of the arc() function be? ...
I have a canvas element defined statically in the html with a width and height. If I attempt to use JavaScript to resize it dynamically (setting a new width and height - either on the attributes of the canvas or via the style properties) I get the following error in Firefox: uncaught exception: [Exception... "Illegal operation on Wra...
I need a 2d political map of the world on which I will draw icons, text, and lines that move around. Users will interact with the map, placing and moving the icons, and they will zoom in and out of the map. The Google Maps interface isn't very far from what I need, but this is NOT web related; it's a Windows MFC application and I want ...
I'm looking for a Python library for creating canvases for manipulating gemetric shapes. Specifically I need the ability to create arbitrary polygons and place them on the canvas, the polygons need to have the ability to be transparent/have an alpha channel, I need to be able to edit polygons that are currently on the canvas, and I need...
When you rotate an image using canvas, it'll get cut off - how do I avoid this? I already made the canvas element bigger then the image, but it's still cutting off the edges. Example: <html> <head> <title>test</title> <script type="text/javascript"> function startup() { var canvas = document.getElementById('c...
How do you rotate an image with the canvas html5 element from the bottom center angle? See http://uptowar.com/test.php for my current code and image: <html> <head> <title>test</title> <script type="text/javascript"> function startup() { var canvas = document.getElementById('canvas'); var ctx = canvas.ge...