From 70f76a25b7ad6214ab07ee0976072b6160032b94 Mon Sep 17 00:00:00 2001 From: wimrijnders Date: Mon, 24 Oct 2016 15:14:37 +0200 Subject: [PATCH] Added point draw method for style 'line' (#2227) --- lib/graph3d/Graph3d.js | 102 ++++++++++++++++------------------------- 1 file changed, 39 insertions(+), 63 deletions(-) diff --git a/lib/graph3d/Graph3d.js b/lib/graph3d/Graph3d.js index f84908ef..10e5f5e8 100644 --- a/lib/graph3d/Graph3d.js +++ b/lib/graph3d/Graph3d.js @@ -804,6 +804,7 @@ Graph3d.prototype.setOptions = function (options) { Settings.setOptions(options, this); + this.setPointDrawingMethod(); this.setSize(this.width, this.height); // re-load the data @@ -819,42 +820,49 @@ Graph3d.prototype.setOptions = function (options) { /** - * Determine which point drawing method to use + * Determine which point drawing method to use for the current graph style. */ -Graph3d.prototype.getPointDrawingMethod = function() { - var pointDrawingMethod = undefined; +Graph3d.prototype.setPointDrawingMethod = function() { + var method = undefined; switch (this.style) { case Graph3d.STYLE.BAR: - pointDrawingMethod = Graph3d.prototype._redrawBarGraphPoint; + method = Graph3d.prototype._redrawBarGraphPoint; break; case Graph3d.STYLE.BARCOLOR: - pointDrawingMethod = Graph3d.prototype._redrawBarColorGraphPoint; + method = Graph3d.prototype._redrawBarColorGraphPoint; break; case Graph3d.STYLE.BARSIZE: - pointDrawingMethod = Graph3d.prototype._redrawBarSizeGraphPoint; + method = Graph3d.prototype._redrawBarSizeGraphPoint; break; case Graph3d.STYLE.DOT: - pointDrawingMethod = Graph3d.prototype._redrawDotGraphPoint; + method = Graph3d.prototype._redrawDotGraphPoint; break; case Graph3d.STYLE.DOTLINE: - pointDrawingMethod = Graph3d.prototype._redrawDotLineGraphPoint; + method = Graph3d.prototype._redrawDotLineGraphPoint; break; case Graph3d.STYLE.DOTCOLOR: - pointDrawingMethod = Graph3d.prototype._redrawDotColorGraphPoint; + method = Graph3d.prototype._redrawDotColorGraphPoint; break; case Graph3d.STYLE.DOTSIZE: - pointDrawingMethod = Graph3d.prototype._redrawDotSizeGraphPoint; + method = Graph3d.prototype._redrawDotSizeGraphPoint; break; case Graph3d.STYLE.SURFACE: - pointDrawingMethod = Graph3d.prototype._redrawSurfaceGraphPoint; + method = Graph3d.prototype._redrawSurfaceGraphPoint; break; case Graph3d.STYLE.GRID: - pointDrawingMethod = Graph3d.prototype._redrawGridGraphPoint; + method = Graph3d.prototype._redrawGridGraphPoint; + break; + case Graph3d.STYLE.LINE: + method = Graph3d.prototype._redrawLineGraphPoint; + break; + default: + throw new Error('Can not determine point drawing method ' + + 'for graph style \'' + this.style + '\''); break; } - return pointDrawingMethod; + this._pointDrawingMethod = method; }; @@ -872,23 +880,7 @@ Graph3d.prototype.redraw = function() { this._redrawClear(); this._redrawAxis(); - var pointDrawingMethod = this.getPointDrawingMethod(); - - if (pointDrawingMethod !== undefined) { - // Use generic drawing loop - // Pass the method reference here - this._redrawDataGraph(pointDrawingMethod); - } else { - // Use the old style drawing methods - - if (this.style === Graph3d.STYLE.LINE) { - this._redrawDataLine(); - } - else { - // Should not be reached any more. - throw new Error('Unknown graph style \'' + this.style + '\''); - } - } + this._redrawDataGraph(); this._redrawInfo(); this._redrawLegend(); @@ -1810,12 +1802,26 @@ Graph3d.prototype._redrawGridGraphPoint = function(ctx, point) { }; +/** + * Draw single datapoint for graph style 'line'. + */ +Graph3d.prototype._redrawLineGraphPoint = function(ctx, point) { + if (point.pointNext === undefined) { + return; + } + + ctx.lineWidth = this._getStrokeWidth(point); + ctx.strokeStyle = this.dataColor.stroke; + + this._line(ctx, point.screen, point.pointNext.screen); +}; + + /** * Draw all datapoints for currently selected graph style. * - * @param pointDrawMethod - method reference to draw a point in a specific graph style. */ -Graph3d.prototype._redrawDataGraph = function(pointDrawMethod) { +Graph3d.prototype._redrawDataGraph = function() { var ctx = this._getContext(); var i; @@ -1828,7 +1834,7 @@ Graph3d.prototype._redrawDataGraph = function(pointDrawMethod) { var point = this.dataPoints[i]; // Using call() ensures that the correct context is used - pointDrawMethod.call(this, ctx, point); + this._pointDrawingMethod.call(this, ctx, point); } }; @@ -1838,36 +1844,6 @@ Graph3d.prototype._redrawDataGraph = function(pointDrawMethod) { // ----------------------------------------------------------------------------- -/** - * Draw a line through all datapoints. - * This function can be used when the style is 'line' - */ -Graph3d.prototype._redrawDataLine = function() { - var ctx = this._getContext(), - point, i; - - if (this.dataPoints === undefined || this.dataPoints.length <= 0) - return; // TODO: throw exception? - - this._calcTranslations(this.dataPoints); - - // start the line - if (this.dataPoints.length > 0) { - point = this.dataPoints[0]; - - ctx.lineWidth = this._getStrokeWidth(point); - ctx.strokeStyle = this.dataColor.stroke; - - for (i = 0; i < this.dataPoints.length; i++) { - point = this.dataPoints[i]; - - if (point.pointNext !== undefined) { - this._line(ctx, point.screen, point.pointNext.screen); - } - } - } -}; - /** * Start a moving operation inside the provided parent element * @param {Event} event The event that occurred (required for