X-Git-Url: https://adrianiainlam.tk/git/?a=blobdiff_plain;f=dashed-canvas.js;fp=dashed-canvas.js;h=0000000000000000000000000000000000000000;hb=3123ca57f71d145bb5bcc4a2f754d3dff3225346;hp=0fc687450ac4b65cc778cd336b2f0eb701c76b78;hpb=26ee953643ccd2d32e38e6b60b20e6a01c1dc9ba;p=dygraphs.git diff --git a/dashed-canvas.js b/dashed-canvas.js deleted file mode 100644 index 0fc6874..0000000 --- a/dashed-canvas.js +++ /dev/null @@ -1,180 +0,0 @@ -/** - * @license - * Copyright 2012 Dan Vanderkam (danvdk@gmail.com) - * MIT-licensed (http://opensource.org/licenses/MIT) - */ - -(function() { -'use strict'; - -/** - * @fileoverview Adds support for dashed lines to the HTML5 canvas. - * - * Usage: - * var ctx = canvas.getContext("2d"); - * ctx.installPattern([10, 5]) // draw 10 pixels, skip 5 pixels, repeat. - * ctx.beginPath(); - * ctx.moveTo(100, 100); // start the first line segment. - * ctx.lineTo(150, 200); - * ctx.lineTo(200, 100); - * ctx.moveTo(300, 150); // start a second, unconnected line - * ctx.lineTo(400, 250); - * ... - * ctx.stroke(); // draw the dashed line. - * ctx.uninstallPattern(); - * - * This is designed to leave the canvas untouched when it's not used. - * If you never install a pattern, or call uninstallPattern(), then the canvas - * will be exactly as it would have if you'd never used this library. The only - * difference from the standard canvas will be the "installPattern" method of - * the drawing context. - */ - -/** - * Change the stroking style of the canvas drawing context from a solid line to - * a pattern (e.g. dashes, dash-dot-dash, etc.) - * - * Once you've installed the pattern, you can draw with it by using the - * beginPath(), moveTo(), lineTo() and stroke() method calls. Note that some - * more advanced methods (e.g. quadraticCurveTo() and bezierCurveTo()) are not - * supported. See file overview for a working example. - * - * Side effects of calling this method include adding an "isPatternInstalled" - * property and "uninstallPattern" method to this particular canvas context. - * You must call uninstallPattern() before calling installPattern() again. - * - * @param {Array.} pattern A description of the stroke pattern. Even - * indices indicate a draw and odd indices indicate a gap (in pixels). The - * array should have a even length as any odd lengthed array could be expressed - * as a smaller even length array. - */ -CanvasRenderingContext2D.prototype.installPattern = function(pattern) { - if (typeof(this.isPatternInstalled) !== 'undefined') { - throw "Must un-install old line pattern before installing a new one."; - } - this.isPatternInstalled = true; - - var dashedLineToHistory = [0, 0]; - - // list of connected line segements: - // [ [x1, y1], ..., [xn, yn] ], [ [x1, y1], ..., [xn, yn] ] - var segments = []; - - // Stash away copies of the unmodified line-drawing functions. - var realBeginPath = this.beginPath; - var realLineTo = this.lineTo; - var realMoveTo = this.moveTo; - var realStroke = this.stroke; - - /** @type {function()|undefined} */ - this.uninstallPattern = function() { - this.beginPath = realBeginPath; - this.lineTo = realLineTo; - this.moveTo = realMoveTo; - this.stroke = realStroke; - this.uninstallPattern = undefined; - this.isPatternInstalled = undefined; - }; - - // Keep our own copies of the line segments as they're drawn. - this.beginPath = function() { - segments = []; - realBeginPath.call(this); - }; - this.moveTo = function(x, y) { - segments.push([[x, y]]); - realMoveTo.call(this, x, y); - }; - this.lineTo = function(x, y) { - var last = segments[segments.length - 1]; - last.push([x, y]); - }; - - this.stroke = function() { - if (segments.length === 0) { - // Maybe the user is drawing something other than a line. - // TODO(danvk): test this case. - realStroke.call(this); - return; - } - - for (var i = 0; i < segments.length; i++) { - var seg = segments[i]; - var x1 = seg[0][0], y1 = seg[0][1]; - for (var j = 1; j < seg.length; j++) { - // Draw a dashed line from (x1, y1) - (x2, y2) - var x2 = seg[j][0], y2 = seg[j][1]; - this.save(); - - // Calculate transformation parameters - var dx = (x2-x1); - var dy = (y2-y1); - var len = Math.sqrt(dx*dx + dy*dy); - var rot = Math.atan2(dy, dx); - - // Set transformation - this.translate(x1, y1); - realMoveTo.call(this, 0, 0); - this.rotate(rot); - - // Set last pattern index we used for this pattern. - var patternIndex = dashedLineToHistory[0]; - var x = 0; - while (len > x) { - // Get the length of the pattern segment we are dealing with. - var segment = pattern[patternIndex]; - // If our last draw didn't complete the pattern segment all the way - // we will try to finish it. Otherwise we will try to do the whole - // segment. - if (dashedLineToHistory[1]) { - x += dashedLineToHistory[1]; - } else { - x += segment; - } - - if (x > len) { - // We were unable to complete this pattern index all the way, keep - // where we are the history so our next draw continues where we - // left off in the pattern. - dashedLineToHistory = [patternIndex, x-len]; - x = len; - } else { - // We completed this patternIndex, we put in the history that we - // are on the beginning of the next segment. - dashedLineToHistory = [(patternIndex+1)%pattern.length, 0]; - } - - // We do a line on a even pattern index and just move on a odd - // pattern index. The move is the empty space in the dash. - if (patternIndex % 2 === 0) { - realLineTo.call(this, x, 0); - } else { - realMoveTo.call(this, x, 0); - } - - // If we are not done, next loop process the next pattern segment, or - // the first segment again if we are at the end of the pattern. - patternIndex = (patternIndex+1) % pattern.length; - } - - this.restore(); - x1 = x2; - y1 = y2; - } - } - realStroke.call(this); - segments = []; - }; -}; - -/** - * Removes the previously-installed pattern. - * You must call installPattern() before calling this. You can install at most - * one pattern at a time--there is no pattern stack. - */ -CanvasRenderingContext2D.prototype.uninstallPattern = function() { - // This will be replaced by a non-error version when a pattern is installed. - throw "Must install a line pattern before uninstalling it."; -}; - -})();