Linked Questions

44 votes
3 answers
69k views

HTML5 canvas drawImage with at an angle

I am experimenting with animation in <canvas> and can't work out how to draw an image at an angle. The desired effect is a few images drawn as usual, with one image rotating slowly. (This image ...
Greg's user avatar
  • 21.7k
7 votes
5 answers
81k views

Drawing a half gauge/speedometer (JavaScript Canvas or Java Swing Example needed) [closed]

has anyone a javascript canvas or java swing example? Something like this: http://www.fmsinc.com/microsoftaccess/controls/components/gauges/gauge-half.gif How should i draw the "separator" lines?
user547064's user avatar
15 votes
4 answers
35k views

Canvas rotate from bottom center image angle?

How do you rotate an image with the canvas html5 element from the bottom center angle? <html> <head> <title>test</title> <script type="text/javascript"&...
Tom's user avatar
  • 7,990
1 vote
3 answers
13k views

Basic Open Source JavaScript Image Editor

I've been looking for, but haven't been able to find, a Web/JavaScript based image editor. Something like aviary, but with the ability to POST the image data back to my hosted server directly (without ...
culturalanomoly's user avatar
1 vote
3 answers
2k views

Programmatically rotate shapes using coordinates

If I have some shapes defined using arrays of coordinates e.g. [[-30, -30], [-30, 30], [30, 30], [30, -30]] and edges defined using: [[0,1],[0,3],[1,2],[2,3]] to make a square. How do I ...
Loveen Dyall's user avatar
12 votes
1 answer
2k views

Free Transform plugin for SVG - creating placeholder element

I'm trying to create html5 collage editor, where you can edit images in similar way to one you see in Word (cropping images instead of scaling them when dragging edges, being able to drag/rotate/scale ...
Paul Walczewski's user avatar
0 votes
1 answer
2k views

How to make a needle image to rotate from 180 degree to 0, half of 360 degree

<!DOCTYPE html> <html> <head> <title>Canvas Cog</title> <script type="text/javascript"> var cog = new Image(); function init() { ...
Kundan SIngh's user avatar
0 votes
1 answer
2k views

jquery rotate: changing the point of rotation possible? (transform canvas function)

I'm trying to do an amimation by rotating an image with the jquery roate plugin. Unfortunately this plugin doesn't change it's point of rotation it's always centered.. and it doesn't have a parameter ...
PartySoft's user avatar
  • 2,799
0 votes
1 answer
691 views

Rotate triangles around center point without overlap

I have a 400x300 HTML Canvas and I'm trying to draw a sun using a circle and 7 triangles. To draw the triangles, I do a translate, rotate, translate as indicated on this SO Answer. However, some of ...
ralrom's user avatar
  • 483
1 vote
2 answers
502 views

Image in HTML Canvas is not rotating

I am creating a website in which I am showing some images. I have gone through many websites and there is no result. HTML: <head></head> <body onload=init()> <img id="imgID" ...
SharpUrBrain's user avatar
  • 3,220
-1 votes
1 answer
87 views

Game object refuses to show on the canvas

Here are the things I know: (1) The ship object is getting rendered to some degree, because I put an extra circle in its render code and that's being drawn. (2) There's nothing wrong (at least, ...
Chris Middleton's user avatar