From: Dan Vanderkam Date: Fri, 19 Jul 2013 17:43:50 +0000 (+0200) Subject: Move custom circles into extras/, save some space X-Git-Url: https://adrianiainlam.tk/git/?a=commitdiff_plain;h=8b12fb5347f01dd34ce9e8e7f112f8e5f1ff64f7;p=dygraphs.git Move custom circles into extras/, save some space --- diff --git a/auto_tests/tests/multiple_axes-old.js b/auto_tests/tests/multiple_axes-old.js index 0f2959e..77e9f89 100644 --- a/auto_tests/tests/multiple_axes-old.js +++ b/auto_tests/tests/multiple_axes-old.js @@ -278,7 +278,7 @@ MultipleAxesOldTestCase.prototype.testOldDrawPointCallback = function() { }; var secondCallback = function(g, seriesName, ctx, canvasx, canvasy, color, radius) { results.y2[seriesName] = 1; - Dygraph.Circles.TRIANGLE(g, seriesName, ctx, canvasx, canvasy, color, radius); + Dygraph.Circles.DEFAULT(g, seriesName, ctx, canvasx, canvasy, color, radius); }; g = new Dygraph( diff --git a/auto_tests/tests/multiple_axes.js b/auto_tests/tests/multiple_axes.js index 8d94803..a995eca 100644 --- a/auto_tests/tests/multiple_axes.js +++ b/auto_tests/tests/multiple_axes.js @@ -225,7 +225,7 @@ MultipleAxesTestCase.prototype.testDrawPointCallback = function() { }; var secondCallback = function(g, seriesName, ctx, canvasx, canvasy, color, radius) { results.y2[seriesName] = 1; - Dygraph.Circles.TRIANGLE(g, seriesName, ctx, canvasx, canvasy, color, radius); + Dygraph.Circles.DEFAULT(g, seriesName, ctx, canvasx, canvasy, color, radius); }; g = new Dygraph( diff --git a/dygraph-utils.js b/dygraph-utils.js index 589cc3a..263ece1 100644 --- a/dygraph-utils.js +++ b/dygraph-utils.js @@ -304,6 +304,7 @@ Dygraph.hsvToRGB = function (hue, saturation, value) { /** * Find the coordinates of an object relative to the top left of the page. + * * TODO(danvk): change obj type from Node -> !Node * @param {Node} obj * @return {{x:number,y:number}} @@ -993,112 +994,13 @@ Dygraph.isPixelChangingOptionList = function(labels, attrs) { return requiresNewPoints; }; -/** - * @param {!CanvasRenderingContext2D} ctx the canvas context - * @param {number} sides the number of sides in the shape. - * @param {number} radius the radius of the image. - * @param {number} cx center x coordate - * @param {number} cy center y coordinate - * @param {number=} rotationRadians the shift of the initial angle, in radians. - * @param {number=} delta the angle shift for each line. If missing, creates a - * regular polygon. - * @private - */ -Dygraph.regularShape_ = function( - ctx, sides, radius, cx, cy, rotationRadians, delta) { - rotationRadians = rotationRadians || 0; - delta = delta || Math.PI * 2 / sides; - - ctx.beginPath(); - var initialAngle = rotationRadians; - var angle = initialAngle; - - var computeCoordinates = function() { - var x = cx + (Math.sin(angle) * radius); - var y = cy + (-Math.cos(angle) * radius); - return [x, y]; - }; - - var initialCoordinates = computeCoordinates(); - var x = initialCoordinates[0]; - var y = initialCoordinates[1]; - ctx.moveTo(x, y); - - for (var idx = 0; idx < sides; idx++) { - angle = (idx == sides - 1) ? initialAngle : (angle + delta); - var coords = computeCoordinates(); - ctx.lineTo(coords[0], coords[1]); - } - ctx.fill(); - ctx.stroke(); -}; - -/** - * TODO(danvk): be more specific on the return type. - * @param {number} sides - * @param {number=} rotationRadians - * @param {number=} delta - * @return {Function} - * @private - */ -Dygraph.shapeFunction_ = function(sides, rotationRadians, delta) { - return function(g, name, ctx, cx, cy, color, radius) { - ctx.strokeStyle = color; - ctx.fillStyle = "white"; - Dygraph.regularShape_(ctx, sides, radius, cx, cy, rotationRadians, delta); - }; -}; - +// For more, include extras/stars.js Dygraph.Circles = { DEFAULT : function(g, name, ctx, canvasx, canvasy, color, radius) { ctx.beginPath(); ctx.fillStyle = color; ctx.arc(canvasx, canvasy, radius, 0, 2 * Math.PI, false); ctx.fill(); - }, - TRIANGLE : Dygraph.shapeFunction_(3), - SQUARE : Dygraph.shapeFunction_(4, Math.PI / 4), - DIAMOND : Dygraph.shapeFunction_(4), - PENTAGON : Dygraph.shapeFunction_(5), - HEXAGON : Dygraph.shapeFunction_(6), - CIRCLE : function(g, name, ctx, cx, cy, color, radius) { - ctx.beginPath(); - ctx.strokeStyle = color; - ctx.fillStyle = "white"; - ctx.arc(cx, cy, radius, 0, 2 * Math.PI, false); - ctx.fill(); - ctx.stroke(); - }, - STAR : Dygraph.shapeFunction_(5, 0, 4 * Math.PI / 5), - PLUS : function(g, name, ctx, cx, cy, color, radius) { - ctx.strokeStyle = color; - - ctx.beginPath(); - ctx.moveTo(cx + radius, cy); - ctx.lineTo(cx - radius, cy); - ctx.closePath(); - ctx.stroke(); - - ctx.beginPath(); - ctx.moveTo(cx, cy + radius); - ctx.lineTo(cx, cy - radius); - ctx.closePath(); - ctx.stroke(); - }, - EX : function(g, name, ctx, cx, cy, color, radius) { - ctx.strokeStyle = color; - - ctx.beginPath(); - ctx.moveTo(cx + radius, cy + radius); - ctx.lineTo(cx - radius, cy - radius); - ctx.closePath(); - ctx.stroke(); - - ctx.beginPath(); - ctx.moveTo(cx + radius, cy - radius); - ctx.lineTo(cx - radius, cy + radius); - ctx.closePath(); - ctx.stroke(); } }; diff --git a/dygraph.js b/dygraph.js index 458760d..cc856bc 100644 --- a/dygraph.js +++ b/dygraph.js @@ -3857,6 +3857,3 @@ Dygraph.addAnnotationRule = function() { this.warn("Unable to add default annotation CSS rule; display may be off."); }; - -// Older pages may still use this name. -var DateGraph = Dygraph; diff --git a/extras/circles.js b/extras/circles.js new file mode 100644 index 0000000..097bc5c --- /dev/null +++ b/extras/circles.js @@ -0,0 +1,118 @@ +/** + * @license + * Copyright 2011 Dan Vanderkam (danvdk@gmail.com) + * MIT-licensed (http://opensource.org/licenses/MIT) + */ + +/** + * @fileoverview + * Including this file will add several additional shapes to Dygraph.Circles + * which can be passed to drawPointCallback. + * See tests/custom-circles.html for usage. + */ + +(function() { + +/** + * @param {!CanvasRenderingContext2D} ctx the canvas context + * @param {number} sides the number of sides in the shape. + * @param {number} radius the radius of the image. + * @param {number} cx center x coordate + * @param {number} cy center y coordinate + * @param {number=} rotationRadians the shift of the initial angle, in radians. + * @param {number=} delta the angle shift for each line. If missing, creates a + * regular polygon. + */ +var regularShape = function( + ctx, sides, radius, cx, cy, rotationRadians, delta) { + rotationRadians = rotationRadians || 0; + delta = delta || Math.PI * 2 / sides; + + ctx.beginPath(); + var initialAngle = rotationRadians; + var angle = initialAngle; + + var computeCoordinates = function() { + var x = cx + (Math.sin(angle) * radius); + var y = cy + (-Math.cos(angle) * radius); + return [x, y]; + }; + + var initialCoordinates = computeCoordinates(); + var x = initialCoordinates[0]; + var y = initialCoordinates[1]; + ctx.moveTo(x, y); + + for (var idx = 0; idx < sides; idx++) { + angle = (idx == sides - 1) ? initialAngle : (angle + delta); + var coords = computeCoordinates(); + ctx.lineTo(coords[0], coords[1]); + } + ctx.fill(); + ctx.stroke(); +}; + +/** + * TODO(danvk): be more specific on the return type. + * @param {number} sides + * @param {number=} rotationRadians + * @param {number=} delta + * @return {Function} + * @private + */ +var shapeFunction = function(sides, rotationRadians, delta) { + return function(g, name, ctx, cx, cy, color, radius) { + ctx.strokeStyle = color; + ctx.fillStyle = "white"; + regularShape(ctx, sides, radius, cx, cy, rotationRadians, delta); + }; +}; + +Dygraph.update(Dygraph.Circles, { + TRIANGLE : shapeFunction(3), + SQUARE : shapeFunction(4, Math.PI / 4), + DIAMOND : shapeFunction(4), + PENTAGON : shapeFunction(5), + HEXAGON : shapeFunction(6), + CIRCLE : function(g, name, ctx, cx, cy, color, radius) { + ctx.beginPath(); + ctx.strokeStyle = color; + ctx.fillStyle = "white"; + ctx.arc(cx, cy, radius, 0, 2 * Math.PI, false); + ctx.fill(); + ctx.stroke(); + }, + STAR : shapeFunction(5, 0, 4 * Math.PI / 5), + PLUS : function(g, name, ctx, cx, cy, color, radius) { + ctx.strokeStyle = color; + + ctx.beginPath(); + ctx.moveTo(cx + radius, cy); + ctx.lineTo(cx - radius, cy); + ctx.closePath(); + ctx.stroke(); + + ctx.beginPath(); + ctx.moveTo(cx, cy + radius); + ctx.lineTo(cx, cy - radius); + ctx.closePath(); + ctx.stroke(); + }, + EX : function(g, name, ctx, cx, cy, color, radius) { + ctx.strokeStyle = color; + + ctx.beginPath(); + ctx.moveTo(cx + radius, cy + radius); + ctx.lineTo(cx - radius, cy - radius); + ctx.closePath(); + ctx.stroke(); + + ctx.beginPath(); + ctx.moveTo(cx + radius, cy - radius); + ctx.lineTo(cx - radius, cy + radius); + ctx.closePath(); + ctx.stroke(); + } +}); + +}); diff --git a/tests/custom-circles.html b/tests/custom-circles.html index 0e6d62f..e85581f 100644 --- a/tests/custom-circles.html +++ b/tests/custom-circles.html @@ -11,6 +11,7 @@ --> + diff --git a/tests/exported-symbols.html b/tests/exported-symbols.html new file mode 100644 index 0000000..8365905 --- /dev/null +++ b/tests/exported-symbols.html @@ -0,0 +1,38 @@ + + + + + Exported Symbols test + + + +

This page lists the set of symbols that dygraphs exports.

+
    +
+ + + + + +