      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