4 <meta http-equiv=
"X-UA-Compatible" content=
"IE=EmulateIE7; IE=EmulateIE9">
5 <title>Per-Series Properties
</title>
7 <script type=
"text/javascript" src=
"../excanvas.js"></script>
10 For production (minified) code, use:
11 <script type=
"text/javascript" src=
"dygraph-combined.js"></script>
13 <script type=
"text/javascript" src=
"../dygraph-dev.js"></script>
17 <h2>Chart with per-series properties
</h2>
18 <div id=
"demodiv"></div>
20 <script type=
"text/javascript">
23 document.getElementById(
"demodiv"),
26 var r =
"x,default,triangle,square,diamond,pentagon,hexagon,circle,star,custom\n";
27 for (var i=
1; i<=
20; i++) {
29 for (var j =
0; j <
9; j++) {
30 r +=
"," + j + (i /
20);
39 'default' : { drawPointCallback : Dygraph.Circles.DEFAULT },
40 'triangle' : { drawPointCallback : Dygraph.Circles.TRIANGLE },
41 'square' : { drawPointCallback : Dygraph.Circles.SQUARE },
42 'diamond' : { drawPointCallback : Dygraph.Circles.DIAMOND },
43 'pentagon' : { drawPointCallback : Dygraph.Circles.PENTAGON },
44 'hexagon' : { drawPointCallback : Dygraph.Circles.HEXAGON },
45 'circle' : { drawPointCallback : Dygraph.Circles.CIRCLE },
46 'star' : { drawPointCallback : Dygraph.Circles.STAR },
47 'custom' : { drawPointCallback : function(g, series, ctx, cx, cy, color, radius) {
48 ctx.fillStyle =
"#FFFF00";
50 ctx.arc(cx, cy, radius, Math.PI*
2, false);
55 ctx.fillStyle =
"#000000";
57 ctx.arc(cx - (radius /
3) , cy - (radius /
4),
1, Math.PI*
2, false);
62 ctx.fillStyle =
"#000000";
64 ctx.arc(cx + (radius /
3) , cy - (radius /
4),
1, Math.PI*
2, false);
69 ctx.fillStyle =
"#000000";
71 ctx.arc(cx, cy, radius -
2,
.3, Math.PI -
.3, false);