Mercurial > hg > NetworkVis

comparison d3s_examples/python-neo4jrestclient/static/platin/lib/excanvas/testcases/resizing.html @ 8:18ef6948d689

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
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 <html>
2 <head>
3 <title>ExplorerCanvas Text Case</title>
4 <!--[if IE]><script type="text/javascript" src="../excanvas.js"></script><![endif]-->
5 <script>
6 // Safari is known not to handle resizing well, expect this to
7 // compare to Firefox
8
9 var cv, ctx, size = 80;
10 var img = new Image();
11 img.src = "../examples/ff.jpg";
12
13 function a() {
14 cv = document.getElementById("aa");
15 ctx = cv.getContext("2d");
16
17 l();
18 }
19
20 function l() {
21 size = (size + 1) % 800;
22 cv.width = Number(size + 200);
23 cv.height = Number((size + 200) / 2);
24
25 // Firefox autoclears the canvas at this point
26
27 ctx.save();
28 ctx.translate(50, 50);
29 ctx.scale(0.1, 0.1);
30 ctx.rotate(size/800 * Math.PI*8);
31 ctx.drawImage(img, 0, -75);
32 ctx.restore();
33
34 ctx.save();
35 ctx.beginPath();
36 ctx.moveTo(0, 0);
37 ctx.lineTo(cv.width, cv.height);
38 ctx.moveTo(20, 20);
39 ctx.lineTo(80, 20);
40 ctx.lineTo(80, 80);
41 ctx.lineTo(20, 80);
42 ctx.stroke();
43 ctx.closePath();
44 ctx.restore();
45
46 ctx.save();
47 ctx.beginPath();
48 ctx.scale(size / 200, size / 200);
49 ctx.arc(100, 50, 20, 0, Math.PI, true);
50 ctx.fill();
51 ctx.restore();
52
53 setTimeout(l, 50);
54 }
55 </script>
56 <style>
57 canvas {
58 background-color:#eee;
59 }
60 </style>
61 </head>
62 <body onload="a();">
63 <canvas id="aa" width="200" height="200">Fallback <b>content</b> markup</canvas>
64 </body>
65 </html>