Mercurial > hg > NetworkVis
comparison d3s_examples/python-neo4jrestclient/static/platin/lib/excanvas/testcases/quadraticcurve.html @ 8:18ef6948d689
new d3s examples
author | Dirk Wintergruen <dwinter@mpiwg-berlin.mpg.de> |
---|---|
date | Thu, 01 Oct 2015 17:17:27 +0200 |
parents | |
children |
comparison
equal
deleted
inserted
replaced
7:45dad9e38c82 | 8:18ef6948d689 |
---|---|
1 <!DOCTYPE html> | |
2 <html> | |
3 <head> | |
4 <title>Quadratic Curve Test</title> | |
5 <style> | |
6 | |
7 body { | |
8 text-align: center | |
9 } | |
10 | |
11 </style> | |
12 <!--[if IE]><script type="text/javascript" src="../excanvas.js"></script><![endif]--> | |
13 <script> | |
14 | |
15 window.onload = function() { | |
16 var ctx = document.getElementById('c').getContext('2d'); | |
17 | |
18 ctx.save(); | |
19 | |
20 ctx.strokeStyle = 'black'; | |
21 ctx.lineWidth = 1; | |
22 ctx.beginPath(); | |
23 ctx.moveTo(50, 50); | |
24 ctx.quadraticCurveTo(0, 0, 25, 75); | |
25 ctx.quadraticCurveTo(50, 0, 50, 50); | |
26 ctx.stroke(); | |
27 | |
28 ctx.restore(); | |
29 | |
30 // Same with some scaling | |
31 ctx.save(); | |
32 | |
33 ctx.translate(-56, -24); | |
34 ctx.scale(3.5, 1.5); | |
35 ctx.strokeStyle = '#ddd'; | |
36 ctx.lineWidth = 1; | |
37 ctx.beginPath(); | |
38 ctx.moveTo(50, 50); | |
39 ctx.quadraticCurveTo(0, 0, 25, 75); | |
40 ctx.quadraticCurveTo(50, 0, 50, 50); | |
41 ctx.stroke(); | |
42 | |
43 ctx.restore(); | |
44 }; | |
45 | |
46 </script> | |
47 </head> | |
48 <body> | |
49 | |
50 <canvas id=c width=200 height=200></canvas> | |
51 | |
52 <p>This tests that drawing quadratic curves work in the same way in different | |
53 browsers.</p> | |
54 | |
55 </body> | |
56 </html> |