canvas

Are there any GUI toolkits built on top of HTML Canvas like swing,swt,gtk or qt?

Are there any GUI toolkits built on top of HTML Canvas like swing,swt,gtk or qt? So that it is possible to build applications like applets or flex gui:s inside the html canvas. ...

shift-reload in FF gives unexpected results

dear javascript mavins, I'm presenting a simple animation using img.src replace and the <canvas> tag. At present it's only expected to work in FireFox (FF 3.5.3, Mac OS X 10.5.5), so cross-browser compatibility isn't (yet) an issue. When the page is first loaded, or loaded into an new window or tab, all seems to work as expected, and t...

how to draw 3d sphere?

I want to draw a 3d ball or sphere in html 5.0 canvas. I want to understand the Algorithm about how to draw 3d sphere. Who can share this with me? Thanks in advance ! ...

Problem printing contents of Canvas tag (Chrome, Opera)

These browsers (Windows versions) correctly print a web page which has a canvas overlay over an img tag image: IE6, IE7, IE8, Firefox, Safari But Chrome (up-to-date as I type this at version 3.0.195.27) and Opera (up-to-date as I type this version 10.0 build 1750) don't. Chrome ignores the canvas rendering entirely. Opera renders the e...

Uploading 'canvas' image data to the server

I need to upload the canvas image data to the server (database) on the fly, i.e., I need to create a form and with an input=file, and post the image data without any user interaction. ...

Setting Canvas to a control template?

I have a Canvas in a ResourceDictionary xaml file like so: <Canvas x:Key="Icon"> <Path ... /> <Path ... /> </Canvas> In my code-behind I load this icon using LayoutGrid.Children.Add(FindResource("Icon") as Canvas); And this works fine. Now I want to create a button that uses the same icon as a template. So I create a cont...

What are unusual and creative usages of html5 canvas

Canvas from html5 was introduced some time ago. Currently it's used (almost) only for demonstrations how cool it is - it's mainly related to painting, games and charts. Many of them can be found at Canvas demos. How creatively / unusually can canvas be used? Some examples: jsAscii - ASCII art from images with Javascript and Canvas (...

How to detect when a canvas is ready for manipulation?

I am dynamically adding X canvas elements to a page via jQuery like so: $(document).ready(function() { for(i=0;i<4;i++) { var can = $(document.createElement("canvas")) .attr("id","table"+i) .addClass("table") .attr("width",640) .attr("height",480) ...

Clipping WPF elements in a canvas

I am working on an interactive WPF graph/tree tool and have nodes and links between them placed in a canvas. The nodes are usercontrols and the links are simply Line shapes, and currently the links go from the centre of a node to another node's centre. The problem arise when I want the nodes to be slightly transparent and one sees the l...

How would one rotate an image around itself using Canvas?

I'm having trouble roating an image around itself using Canvas. Since you can't rotate an image you have to rotate the canvas: if I rotate the canvas by a degree the origin around which I want to rotate changes. I don't get how to track this change. This is my current code: http://pastie.org/669023 And a demo is at http://preview.netl...

Algorithm to sort parents before children

I'm writing a drawing application that includes shapes that can have children. When I need to redraw the canvas, I would like to sort the shapes to draw so that the parents appear before their children. That way, a parent shape won't be drawn on top of a child shape. Here is the relevant function (written in JavaScript). Variables prefix...

Excanvas for dynamically created canvas elements

Excanvas "for enternet Explorer" is working fine for predefined canvas elements. But when it comes to creating canvas elements dynamically during the script, it will not work... Any ideas?? ...

How to resize a HTML Canvas object after creating using createElement()?

I'm creating a HTML Canvas object using this javascript code: var Canvas = document.createElement("canvas"); Canvas.style.width = "500px"; and then i'm drawing text upon it. When the canvas is displayed, the whole canvas has been scaled up (including content) to to match the 500px width, which results in ugly resampling. What i real...

WPF Canvas and Grid overlay

I have a grid which represents some data, and i need a canvas to overlay on top of it to layout some lines. The canvas is inside it's own usercontrol The problem is that the canvas and it's contents should autoresize when the grid resizes width and height. I added the canvas inside a viewbox, but it didn't do the trick. When the grid...

WPF and canvas overlay

I have a grid which represents some data, and i need a canvas to overlay on top of it to layout some lines. The canvas is inside it's own usercontrol The problem is that the canvas and it's contents should autoresize when the grid resizes width and height. I added the canvas inside a viewbox, but it didn't do the trick. When the grid r...

Drawing and clearing the desktop canvas with Delphi

I'm trying to draw over the whole screen by using the desktop canvas and painting to it directly. The problem is I can't clear that desktop canvas. I've tried setting the canvas.pen.style to psNotXOR and draw over the old image but unfortunately, this is not reliable enough and some left overs are still present in some conditions. My ne...

HTML5 Canvas resize to fit window

How can I automatically scale the HTML5 <canvas> element to fit the page? For example, I can get a <div> to scale by setting height and width to 100%, but a <canvas> won't scale, will it? ...

Rounded corners with Canvas/VML in IE8

I'm using the JRC (jQuery Rounded Corners) plugin for rounded corners. It works in almost all browsers (including the crappy IE6) except IE8. Is there any workaround for the newest sh** from MS? Thanks ...

Creating a Canvas Background Dynamically

I currently have a canvas which contains a bunch of sqaures as its children. These sqaures sit on different lines. I would like to draw a background for the canvas which draws lines (like a notepad would have feint blue lines on the paper) I would like to draw this dynamically by binding it to a collection of "lines" So if there are 2 ...

Is it an anti-pattern to modify JavaScript's built-in prototypes?

I understand from this post, that it's an anti-pattern to modify Object's prototype in JavaScript. I was curious, however, if it's widely considered to be an antipattern to modify other 'built-in' prototypes. For example: say we wanted to add a setPixel(x,y,color) function to CanvasRenderingContext2D - to abstract out the duty of get...