X-Git-Url: https://adrianiainlam.tk/git/?a=blobdiff_plain;f=dygraph-utils.js;h=c6c3a60345712b76cd023fa212011b3fb0611c17;hb=6a4457b403f78ba559550f97330ac25ee4d9629f;hp=0ae3f08f24bd1ff4c800ab1e4c8efffeea60447e;hpb=78e58af463c6b5a09d85d6014bbdba0b3d8a605a;p=dygraphs.git diff --git a/dygraph-utils.js b/dygraph-utils.js index 0ae3f08..c6c3a60 100644 --- a/dygraph-utils.js +++ b/dygraph-utils.js @@ -35,6 +35,13 @@ Dygraph.ERROR = 3; // https://github.com/eriwen/javascript-stacktrace Dygraph.LOG_STACK_TRACES = false; +/** A dotted line stroke pattern. */ +Dygraph.DOTTED_LINE = [2, 2]; +/** A dashed line stroke pattern. */ +Dygraph.DASHED_LINE = [7, 3]; +/** A dot dash stroke pattern. */ +Dygraph.DOT_DASH_LINE = [7, 2, 2, 2]; + /** * @private * Log an error on the JS console at the given severity. @@ -325,6 +332,21 @@ Dygraph.isOK = function(x) { }; /** + * @private + * @param { Object } p The point to consider, valid points are {x, y} objects + * @param { Boolean } allowNaNY Treat point with y=NaN as valid + * @return { Boolean } Whether the point has numeric x and y. + */ +Dygraph.isValidPoint = function(p, allowNaNY) { + if (!p) return false; // null or undefined object + if (p.yval === null) return false; // missing point + if (p.x === null || p.x === undefined) return false; + if (p.y === null || p.y === undefined) return false; + if (isNaN(p.x) || (!allowNaNY && isNaN(p.y))) return false; + return true; +}; + +/** * Number formatting function which mimicks the behavior of %g in printf, i.e. * either exponential or fixed format (without trailing 0s) is used depending on * the length of the generated string. The advantage of this format is that @@ -472,9 +494,17 @@ Dygraph.dateParser = function(dateStr) { var dateStrSlashed; var d; - // Let the system try the format first. - d = Dygraph.dateStrToMillis(dateStr); - if (d && !isNaN(d)) return d; + // Let the system try the format first, with one caveat: + // YYYY-MM-DD[ HH:MM:SS] is interpreted as UTC by a variety of browsers. + // dygraphs displays dates in local time, so this will result in surprising + // inconsistencies. But if you specify "T" or "Z" (i.e. YYYY-MM-DDTHH:MM:SS), + // then you probably know what you're doing, so we'll let you go ahead. + // Issue: http://code.google.com/p/dygraphs/issues/detail?id=255 + if (dateStr.search("-") == -1 || + dateStr.search("T") != -1 || dateStr.search("Z") != -1) { + d = Dygraph.dateStrToMillis(dateStr); + if (d && !isNaN(d)) return d; + } if (dateStr.search("-") != -1) { // e.g. '2009-7-12' or '2009-07-12' dateStrSlashed = dateStr.replace("-", "/", "g"); @@ -693,7 +723,7 @@ Dygraph.isPixelChangingOptionList = function(labels, attrs) { 'clickCallback': true, 'digitsAfterDecimal': true, 'drawCallback': true, - 'drawHighlightCallback': true, + 'drawHighlightPointCallback': true, 'drawPoints': true, 'drawPointCallback': true, 'drawXGrid': true, @@ -778,37 +808,79 @@ Dygraph.isPixelChangingOptionList = function(labels, attrs) { return requiresNewPoints; }; +/** + * Compares two arrays to see if they are equal. If either parameter is not an + * array it will return false. Does a shallow compare + * Dygraph.compareArrays([[1,2], [3, 4]], [[1,2], [3,4]]) === false. + * @param array1 first array + * @param array2 second array + * @return True if both parameters are arrays, and contents are equal. + */ +Dygraph.compareArrays = function(array1, array2) { + if (!Dygraph.isArrayLike(array1) || !Dygraph.isArrayLike(array2)) { + return false; + } + if (array1.length !== array2.length) { + return false; + } + for (var i = 0; i < array1.length; i++) { + if (array1[i] !== array2[i]) { + return false; + } + } + return true; +}; -Dygraph.RegularConvex = function(sides, rotation) { - this.sides = sides; - this.rotation = rotation ? rotation : 0; - this.delta = Math.PI * 2 / sides; -} +/** + * ctx: the canvas context + * sides: the number of sides in the shape. + * radius: the radius of the image. + * cx: center x coordate + * cy: center y coordinate + * rotationRadians: the shift of the initial angle, in radians. + * delta: the angle shift for each line. If missing, creates a regular + * polygon. + */ +Dygraph.regularShape_ = function( + ctx, sides, radius, cx, cy, rotationRadians, delta) { + rotationRadians = rotationRadians ? rotationRadians : 0; + delta = delta ? delta : Math.PI * 2 / sides; + + ctx.beginPath(); + var first = true; + 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); -Dygraph.RegularConvex.prototype.draw = function(ctx, cx, cy, radius, angleAdjustment) { - ctx.beginPath(); - var first = true; - if (!angleAdjustment) angleAdjustment = 0; - var angle = this.rotation + angleAdjustment; - - var x = cx + (Math.sin(angle) * radius); - var y = cy + (-Math.cos(angle) * radius); - ctx.moveTo(x, y); - - for (var idx = 0; idx < this.sides; idx++) { - angle = (idx == this.sides - 1) ? this.rotation : (angle + this.delta); - var x = cx + (Math.sin(angle) * radius); - var y = cy + (-Math.cos(angle) * radius); - ctx.lineTo(x, y); - } - ctx.stroke(); - ctx.closePath(); + 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(); } -Dygraph.DrawPolygon_ = function(sides, rotation, ctx, cx, cy, color, radius, angleAdjustment) { - ctx.lineWidth = 1; - ctx.strokeStyle = color; - new Dygraph.RegularConvex(sides, rotation).draw(ctx, cx, cy, radius, angleAdjustment); +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); + }; +}; + +Dygraph.DrawPolygon_ = function(sides, rotationRadians, ctx, cx, cy, color, radius, delta) { + new Dygraph.RegularShape_(sides, rotationRadians, delta).draw(ctx, cx, cy, radius); } Dygraph.Circles = { @@ -818,29 +890,48 @@ Dygraph.Circles = { ctx.arc(canvasx, canvasy, radius, 0, 2 * Math.PI, false); ctx.fill(); }, - TRIANGLE : function(g, name, ctx, cx, cy, color, radius) { - Dygraph.DrawPolygon_(3, Math.PI / 3, ctx, cx, cy, color, radius); - }, - SQUARE : function(g, name, ctx, cx, cy, color, radius) { - Dygraph.DrawPolygon_(4, Math.PI / 4, ctx, cx, cy, color, radius); - }, - DIAMOND : function(g, name, ctx, cx, cy, color, radius) { - Dygraph.DrawPolygon_(4, Math.PI / 4, ctx, cx, cy, color, radius, Math.PI / 8); - }, - PENTAGON : function(g, name, ctx, cx, cy, color, radius) { - Dygraph.DrawPolygon_(5, Math.PI / 5, ctx, cx, cy, color, radius); - }, - HEXAGON : function(g, name, ctx, cx, cy, color, radius) { - Dygraph.DrawPolygon_(6, Math.PI / 6, ctx, cx, cy, color, radius); - }, + 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.lineStyle = color; + 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(); }, - STAR : function(g, name, ctx, cx, cy, color, radius) { - Dygraph.DrawPolygon_(5, 2 * Math.PI / 5, ctx, cx, cy, color, radius); + 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(); } - // TODO: plus, x. };