Bug 14579 - Add ellipse support to canvas
Add ellipse support to canvas
Status: RESOLVED FIXED
Product: HTML WG
Classification: Unclassified
Component: HTML Canvas 2D Context
unspecified
All All
: P3 enhancement
: ---
Assigned To: Ian 'Hixie' Hickson
HTML WG Bugzilla archive list
http://www.whatwg.org/specs/web-apps/...
canvas v5
:
: 15026 (view as bug list)
Depends on: 9236
Blocks:
  Show dependency treegraph
 
Reported: 2011-10-27 22:02 UTC by contributor
Modified: 2012-03-28 21:47 UTC (History)
7 users (show)

See Also:


Attachments

Note You need to log in before you can comment on or make changes to this bug.
Description contributor 2011-10-27 22:02:27 UTC
Specification: http://www.w3.org/TR/2dcontext/
Multipage: http://www.whatwg.org/C#top
Complete: http://www.whatwg.org/c#top

Comment:
filing a separate feature request as requested in
http://www.w3.org/Bugs/Public/show_bug.cgi?id=14562
---

Please add an elliptical arc command in addition to the circular arc command.
For nice graphics, you need the elliptical arc, and a separate circular arc is
a bonus because you can perfectly reproduce a circle with an ellipse. As such,
please add an elliptical arc command to the API. It won't break work already
done by people so far, it's not a lot of work to implement for browser makers,
and for the end user it will offer a fast and correct arcing command, unlike
artificial solutions involving rolling your own approximation using bezier
curves or implementing the midpoint algorithm every time you need an
elliptical arc.

Use cases: anything from general drawing libraries to people directly using
the canvas to draw simple things. My personal use case is the Processing.js
project, but anyone who wants to draw ellipses or parts of ellipses is covered
by this request. Since the ellipse is a common primitive in every major
graphical application, and everyone expect it to exist in graphical languages,
the fact that Canvas2D doesn't have one is simply an oversight that can be
remedied without too much work for everyone.

In response to Robert O'Callahan: using a scaled circular arc will lead to the
stroking in either x or y dimension being either too thin (if scaled down) or
too thick (if scaled up). In addition, it's just as artificial as
approximating an elliptical arc with bezier curves in the sense that you'd be
writing a lot of code to do something that should be available as a single
command; a bit like not offering people a rect() command, but instead telling
them to use a combination of line() and rotate(). Your suggestion is a
possible stopgap measure (although not as good as bezier approximation,
because of the scaling interpolation), but cannot be considered a good
solution.

Posted from: 205.250.164.138
User agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/535.1 (KHTML, like Gecko) Chrome/14.0.835.187 Safari/535.1
Comment 1 Ian 'Hixie' Hickson 2011-11-01 06:00:17 UTC
This is highly likely to be added in due course based on the frequency of requests.
Comment 2 Ian 'Hixie' Hickson 2011-11-01 16:33:32 UTC
EDITOR'S RESPONSE: This is an Editor's Response to your comment. If you are satisfied with this response, please change the state of this bug to CLOSED. If you have additional information and would like the editor to reconsider, please reopen this bug. If you would like to escalate the issue to the full HTML Working Group, please add the TrackerRequest keyword to this bug, and suggest title and text for the tracker issue; or you may create a tracker issue yourself, if you are able to do so. For more details, see this document:
   http://dev.w3.org/html5/decision-policy/decision-policy.html

Status: Partially Accepted
Change Description: none yet
Rationale: I have marked this LATER so that we can look at this again once browsers have caught up with what we've specified so far. I expect this will be added along with the next batch of <canvas> features (path primitives), so it shouldn't take long. I'll mark the other path bugs as dependencies.
Comment 3 Ian 'Hixie' Hickson 2011-12-07 20:48:28 UTC
*** Bug 15026 has been marked as a duplicate of this bug. ***
Comment 4 Ian 'Hixie' Hickson 2012-02-29 19:22:56 UTC
Currently planning on supporting this just by adding an extra radius argument to the two arc-related path methods. To have an ellipse not aligned with the x or y axes with such an API, you'd have to use a rotation transform. Is that ok?

See also http://wiki.whatwg.org/wiki/Canvas#Ellipses
Comment 5 Ian 'Hixie' Hickson 2012-03-13 23:06:58 UTC
EDITOR'S RESPONSE: This is an Editor's Response to your comment. If you are satisfied with this response, please change the state of this bug to CLOSED. If you have additional information and would like the editor to reconsider, please reopen this bug. If you would like to escalate the issue to the full HTML Working Group, please add the TrackerRequest keyword to this bug, and suggest title and text for the tracker issue; or you may create a tracker issue yourself, if you are able to do so. For more details, see this document:
   http://dev.w3.org/html5/decision-policy/decision-policy.html

Status: Accepted
Change Description: r7025
Rationale: Concurred with reporter's comments.
Comment 6 Ian 'Hixie' Hickson 2012-03-28 21:47:36 UTC
EDITOR'S RESPONSE: This is an Editor's Response to your comment. If you are satisfied with this response, please change the state of this bug to CLOSED. If you have additional information and would like the editor to reconsider, please reopen this bug. If you would like to escalate the issue to the full HTML Working Group, please add the TrackerRequest keyword to this bug, and suggest title and text for the tracker issue; or you may create a tracker issue yourself, if you are able to do so. For more details, see this document:
   http://dev.w3.org/html5/decision-policy/decision-policy.html

Status: Accepted
Change Description: ellipse() and arcTo() changes
Rationale: Concurred with reporter's comments.