1 /**
  2  * @license
  3  * Copyright 2011 Dan Vanderkam (danvdk@gmail.com)
  4  * MIT-licenced: https://opensource.org/licenses/MIT
  5  */
  6 
  7 /**
  8  * @fileoverview
  9  * Including this file will add several additional shapes to Dygraph.Circles
 10  * which can be passed to drawPointCallback.
 11  * See tests/custom-circles.html for usage.
 12  */
 13 
 14 (function() {
 15 
 16 /**
 17  * @param {!CanvasRenderingContext2D} ctx the canvas context
 18  * @param {number} sides the number of sides in the shape.
 19  * @param {number} radius the radius of the image.
 20  * @param {number} cx center x coordate
 21  * @param {number} cy center y coordinate
 22  * @param {number=} rotationRadians the shift of the initial angle, in radians.
 23  * @param {number=} delta the angle shift for each line. If missing, creates a
 24  *     regular polygon.
 25  */
 26 var regularShape = function(
 27     ctx, sides, radius, cx, cy, rotationRadians, delta) {
 28   rotationRadians = rotationRadians || 0;
 29   delta = delta || Math.PI * 2 / sides;
 30 
 31   ctx.beginPath();
 32   var initialAngle = rotationRadians;
 33   var angle = initialAngle;
 34 
 35   var computeCoordinates = function() {
 36     var x = cx + (Math.sin(angle) * radius);
 37     var y = cy + (-Math.cos(angle) * radius);
 38     return [x, y];
 39   };
 40 
 41   var initialCoordinates = computeCoordinates();
 42   var x = initialCoordinates[0];
 43   var y = initialCoordinates[1];
 44   ctx.moveTo(x, y);
 45 
 46   for (var idx = 0; idx < sides; idx++) {
 47     angle = (idx == sides - 1) ? initialAngle : (angle + delta);
 48     var coords = computeCoordinates();
 49     ctx.lineTo(coords[0], coords[1]);
 50   }
 51   ctx.fill();
 52   ctx.stroke();
 53 };
 54 
 55 /**
 56  * TODO(danvk): be more specific on the return type.
 57  * @param {number} sides
 58  * @param {number=} rotationRadians
 59  * @param {number=} delta
 60  * @return {Function}
 61  * @private
 62  */
 63 var shapeFunction = function(sides, rotationRadians, delta) {
 64   return function(g, name, ctx, cx, cy, color, radius) {
 65     ctx.strokeStyle = color;
 66     ctx.fillStyle = "white";
 67     regularShape(ctx, sides, radius, cx, cy, rotationRadians, delta);
 68   };
 69 };
 70 
 71 var customCircles = {
 72   TRIANGLE : shapeFunction(3),
 73   SQUARE : shapeFunction(4, Math.PI / 4),
 74   DIAMOND : shapeFunction(4),
 75   PENTAGON : shapeFunction(5),
 76   HEXAGON : shapeFunction(6),
 77   CIRCLE : function(g, name, ctx, cx, cy, color, radius) {
 78     ctx.beginPath();
 79     ctx.strokeStyle = color;
 80     ctx.fillStyle = "white";
 81     ctx.arc(cx, cy, radius, 0, 2 * Math.PI, false);
 82     ctx.fill();
 83     ctx.stroke();
 84   },
 85   STAR : shapeFunction(5, 0, 4 * Math.PI / 5),
 86   PLUS : function(g, name, ctx, cx, cy, color, radius) {
 87     ctx.strokeStyle = color;
 88 
 89     ctx.beginPath();
 90     ctx.moveTo(cx + radius, cy);
 91     ctx.lineTo(cx - radius, cy);
 92     ctx.closePath();
 93     ctx.stroke();
 94 
 95     ctx.beginPath();
 96     ctx.moveTo(cx, cy + radius);
 97     ctx.lineTo(cx, cy - radius);
 98     ctx.closePath();
 99     ctx.stroke();
100   },
101   EX : function(g, name, ctx, cx, cy, color, radius) {
102     ctx.strokeStyle = color;
103 
104     ctx.beginPath();
105     ctx.moveTo(cx + radius, cy + radius);
106     ctx.lineTo(cx - radius, cy - radius);
107     ctx.closePath();
108     ctx.stroke();
109 
110     ctx.beginPath();
111     ctx.moveTo(cx + radius, cy - radius);
112     ctx.lineTo(cx - radius, cy + radius);
113     ctx.closePath();
114     ctx.stroke();
115   }
116 };
117 
118 for (var k in customCircles) {
119   if (!customCircles.hasOwnProperty(k)) continue;
120   Dygraph.Circles[k] = customCircles[k];
121 }
122 
123 })();
124