Canvas tutorial

  • Revision slug: Talk:Canvas_tutorial
  • Revision title: Canvas tutorial
  • Revision id: 103874
  • Created:
  • Creator: gws
  • Is current revision? No
  • Comment 261 words added

Revision Content

There's a whole bunch of canvas demos, tutorials, games and tools on http://www.canvasdemos.com -- AndiSmith


I made a simple page that can be used to play with canvas: http://mozilla.doslash.org/stuff/canvas/shell.html --Nickolay 03:00, 8 September 2005 (PDT)


Another example built using canvas, works on Firefox 1.5b & Safari 1.3/2.0: http://www.wirelesshamster.com/cosas...julia_set.html

It renders fractals (Mandelbrot & Julia sets) at various levels of detail, and lets you zoom in. Please note that high levels of detail will take a long time to calculate (rendering itself is instantaneous, but the calculations needed to generate the fractal are slow). --Powermacx 06:48, 13 October 2005 (PDT)

 


I've created a mailing list for canvas developers at http://groups.yahoo.com/group/canvas-developers/ --Triptych 02:38, 27 November 2005

How do I leave comments on these pages if some contents seems off? It seems I could edit some pages directly (which I am reluctant to do without discussion), in other cases I cannot edit the "Talk" page, which seems to be the place that I shold use.

In any case, here are two remarks (apart from the fact that I find this tutorial eminently helpful);

(i) In the "transformations" page, the content at the very end seems just to have been copied from the specs and actually addess the implementor of a renedering and/or Javacript engine, not the user. ("The matrix must be marked as infinite" etc.)

(ii) In "Applying styles...", in the section on miterlimit, it is claimed that "the miter length increases exponentially" with decreasing angle. Near as I can tell, that is not the case: it increases inversely proportional with the angle. (That's also pretty fast, but not exponential.) (Mathematical reason: given line width w and angle z, the miter length is essentially x = w/2*(1/(tan z) + 1/(sin z)). As z approaches 0, tan z -> sin z, so x -> w/(sin z). Looking at the power series for z, we get x -> w/z. Qed.)

Revision Source

<p>There's a whole bunch of canvas demos, tutorials, games and tools on <a class=" external" href="http://www.canvasdemos.com" rel="freelink">http://www.canvasdemos.com</a> -- AndiSmith</p>
<hr>
<p>I made a simple page that can be used to play with canvas: <a class=" external" href="http://mozilla.doslash.org/stuff/canvas/shell.html" rel="freelink">http://mozilla.doslash.org/stuff/canvas/shell.html</a> --<a href="/User:Nickolay" title="User:Nickolay">Nickolay</a> 03:00, 8 September 2005 (PDT)</p>
<hr>
<p>Another example built using canvas, works on Firefox 1.5b &amp; Safari 1.3/2.0: <a class=" external" href="http://www.wirelesshamster.com/cosas/canvas_mandelbrot_julia_set.html" rel="freelink">http://www.wirelesshamster.com/cosas...julia_set.html</a></p>
<p>It renders fractals (Mandelbrot &amp; Julia sets) at various levels of detail, and lets you zoom in. Please note that high levels of detail will take a long time to calculate (rendering itself is instantaneous, but the calculations needed to generate the fractal are slow). --<a href="/User:Powermacx" title="User:Powermacx">Powermacx</a> 06:48, 13 October 2005 (PDT)</p>
<p> </p>
<hr>
<p>I've created a mailing list for canvas developers at <a class=" external" href="http://groups.yahoo.com/group/canvas-developers/" rel="freelink">http://groups.yahoo.com/group/canvas-developers/</a> --<a href="/User:Triptych" title="User:Triptych">Triptych</a> 02:38, 27 November 2005</p>
<p>How do I leave comments on these pages if some contents seems off? It seems I could edit some pages directly (which I am reluctant to do without discussion), in other cases I cannot edit the "Talk" page, which seems to be the place that I shold use.</p>
<p>In any case, here are two remarks (apart from the fact that I find this tutorial eminently helpful);</p>
<p>(i) In the "transformations" page, the content at the very end seems just to have been copied from the specs and actually addess the implementor of a renedering and/or Javacript engine, not the user. ("The matrix must be marked as infinite" etc.)</p>
<p>(ii) In "Applying styles...", in the section on miterlimit, it is claimed that "the miter length increases exponentially" with decreasing angle. Near as I can tell, that is not the case: it increases inversely proportional with the angle. (That's also pretty fast, but not exponential.) (Mathematical reason: given line width w and angle z, the miter length is essentially x = w/2*(1/(tan z) + 1/(sin z)). As z approaches 0, tan z -&gt; sin z, so x -&gt; w/(sin z). Looking at the power series for z, we get x -&gt; w/z. Qed.)</p>
Revert to this revision