From 4b235aba70fff46f9dc7492f6cb22e06f2d4ceee Mon Sep 17 00:00:00 2001 From: Wim Rijnders Date: Mon, 17 Oct 2016 16:47:29 +0200 Subject: [PATCH] Translation of all data points to single method. --- lib/graph3d/Graph3d.js | 95 ++++++++++++++++-------------------------- 1 file changed, 35 insertions(+), 60 deletions(-) diff --git a/lib/graph3d/Graph3d.js b/lib/graph3d/Graph3d.js index e13e53f7..d990a96c 100644 --- a/lib/graph3d/Graph3d.js +++ b/lib/graph3d/Graph3d.js @@ -226,6 +226,37 @@ Graph3d.prototype._convertTranslationToScreen = function(translation) { this.ycenter - by * this.frame.canvas.clientWidth); }; + +/** + * Calculate the translations and screen positions of all points + */ +Graph3d.prototype._calcTranslations = function(points, sort) { + if (sort === undefined) { + sort = true; + } + + for (var i = 0; i < points.length; i++) { + var point = points[i]; + point.trans = this._convertPointToTranslation(point.point); + point.screen = this._convertTranslationToScreen(point.trans); + + // calculate the translation of the point at the bottom (needed for sorting) + var transBottom = this._convertPointToTranslation(point.bottom); + point.dist = this.showPerspective ? transBottom.length() : -transBottom.z; + } + + if (!sort) { + return; + } + + // sort the points on depth of their (x,y) position (not on z) + var sortDepth = function (a, b) { + return b.dist - a.dist; + }; + points.sort(sortDepth); +}; + + /** * Set the background styling for the graph * @param {string | {fill: string, stroke: string, strokeWidth: string}} backgroundColor @@ -1467,24 +1498,7 @@ Graph3d.prototype._redrawDataGrid = function() { if (this.dataPoints === undefined || this.dataPoints.length <= 0) return; // TODO: throw exception? - // calculate the translations and screen position of all points - for (i = 0; i < this.dataPoints.length; i++) { - var trans = this._convertPointToTranslation(this.dataPoints[i].point); - var screen = this._convertTranslationToScreen(trans); - - this.dataPoints[i].trans = trans; - this.dataPoints[i].screen = screen; - - // calculate the translation of the point at the bottom (needed for sorting) - var transBottom = this._convertPointToTranslation(this.dataPoints[i].bottom); - this.dataPoints[i].dist = this.showPerspective ? transBottom.length() : -transBottom.z; - } - - // sort the points on depth of their (x,y) position (not on z) - var sortDepth = function (a, b) { - return b.dist - a.dist; - }; - this.dataPoints.sort(sortDepth); + this._calcTranslations(this.dataPoints); if (this.style === Graph3d.STYLE.SURFACE) { for (i = 0; i < this.dataPoints.length; i++) { @@ -1601,23 +1615,7 @@ Graph3d.prototype._redrawDataDot = function() { if (this.dataPoints === undefined || this.dataPoints.length <= 0) return; // TODO: throw exception? - // calculate the translations of all points - for (i = 0; i < this.dataPoints.length; i++) { - var trans = this._convertPointToTranslation(this.dataPoints[i].point); - var screen = this._convertTranslationToScreen(trans); - this.dataPoints[i].trans = trans; - this.dataPoints[i].screen = screen; - - // calculate the distance from the point at the bottom to the camera - var transBottom = this._convertPointToTranslation(this.dataPoints[i].bottom); - this.dataPoints[i].dist = this.showPerspective ? transBottom.length() : -transBottom.z; - } - - // order the translated points by depth - var sortDepth = function (a, b) { - return b.dist - a.dist; - }; - this.dataPoints.sort(sortDepth); + this._calcTranslations(this.dataPoints); // draw the datapoints as colored circles var dotSize = this.frame.clientWidth * this.dotSizeRatio; // px @@ -1692,23 +1690,7 @@ Graph3d.prototype._redrawDataBar = function() { if (this.dataPoints === undefined || this.dataPoints.length <= 0) return; // TODO: throw exception? - // calculate the translations of all points - for (i = 0; i < this.dataPoints.length; i++) { - var trans = this._convertPointToTranslation(this.dataPoints[i].point); - var screen = this._convertTranslationToScreen(trans); - this.dataPoints[i].trans = trans; - this.dataPoints[i].screen = screen; - - // calculate the distance from the point at the bottom to the camera - var transBottom = this._convertPointToTranslation(this.dataPoints[i].bottom); - this.dataPoints[i].dist = this.showPerspective ? transBottom.length() : -transBottom.z; - } - - // order the translated points by depth - var sortDepth = function (a, b) { - return b.dist - a.dist; - }; - this.dataPoints.sort(sortDepth); + this._calcTranslations(this.dataPoints); ctx.lineJoin = 'round'; ctx.lineCap = 'round'; @@ -1833,14 +1815,7 @@ Graph3d.prototype._redrawDataLine = function() { if (this.dataPoints === undefined || this.dataPoints.length <= 0) return; // TODO: throw exception? - // calculate the translations of all points - for (i = 0; i < this.dataPoints.length; i++) { - var trans = this._convertPointToTranslation(this.dataPoints[i].point); - var screen = this._convertTranslationToScreen(trans); - - this.dataPoints[i].trans = trans; - this.dataPoints[i].screen = screen; - } + this._calcTranslations(this.dataPoints, false); // start the line if (this.dataPoints.length > 0) {