Browse Source

Stricter Lint Rules on Graph3d (#3359)

* Tighten up lint rules in graph3d

* remove extra line
revert-3409-performance
macleodbroad-wf 7 years ago
committed by Yotam Berkowitz
parent
commit
8589ff689e
9 changed files with 272 additions and 40 deletions
  1. +8
    -4
      .eslintrc
  2. +40
    -0
      lib/graph3d/.eslintrc
  3. +2
    -1
      lib/graph3d/Camera.js
  4. +20
    -5
      lib/graph3d/DataGroup.js
  5. +4
    -0
      lib/graph3d/Filter.js
  6. +153
    -17
      lib/graph3d/Graph3d.js
  7. +34
    -10
      lib/graph3d/Settings.js
  8. +6
    -3
      lib/graph3d/Slider.js
  9. +5
    -0
      lib/graph3d/StepNumber.js

+ 8
- 4
.eslintrc View File

@ -26,10 +26,14 @@
"ClassDeclaration": false, "ClassDeclaration": false,
"ArrowFunctionExpression": false "ArrowFunctionExpression": false
} }
}],
// "valid-jsdoc": 2
}]
// "valid-jsdoc": [2, {
// "requireReturnDescription": false,
// "requireReturn": false,
// "requireParamDescription": false,
// "requireReturnType": false
// }],
}
// To flag presence of console.log without breaking linting: // To flag presence of console.log without breaking linting:
//"no-console": ["warn", { allow: ["warn", "error"] }], //"no-console": ["warn", { allow: ["warn", "error"] }],
}
} }

+ 40
- 0
lib/graph3d/.eslintrc View File

@ -0,0 +1,40 @@
{
"env": {
"browser": true,
"es6": true,
"node": true,
"mocha": true
},
"parserOptions": {
"sourceType": "module",
},
"extends": "eslint:recommended",
// For the full list of rules, see: http://eslint.org/docs/rules/
"rules": {
"complexity": [2, 55],
"max-statements": [2, 115],
"no-unreachable": 1,
"no-useless-escape": 0,
"no-console": 0,
"require-jsdoc": ["error", {
"require": {
"FunctionDeclaration": true,
"MethodDefinition": true,
"ClassDeclaration": true,
"ArrowFunctionExpression": true
}
}],
"valid-jsdoc": [2, {
"requireReturnDescription": false,
"requireReturn": false,
"requireParamDescription": false,
"requireReturnType": true
}],
}
// To flag presence of console.log without breaking linting:
//"no-console": ["warn", { allow: ["warn", "error"] }],
}

+ 2
- 1
lib/graph3d/Camera.js View File

@ -1,7 +1,6 @@
var Point3d = require('./Point3d'); var Point3d = require('./Point3d');
/** /**
* @class Camera
* The camera is mounted on a (virtual) camera arm. The camera arm can rotate * The camera is mounted on a (virtual) camera arm. The camera arm can rotate
* The camera is always looking in the direction of the origin of the arm. * The camera is always looking in the direction of the origin of the arm.
* This way, the camera always rotates around one fixed point, the location * This way, the camera always rotates around one fixed point, the location
@ -9,6 +8,7 @@ var Point3d = require('./Point3d');
* *
* Documentation: * Documentation:
* http://en.wikipedia.org/wiki/3D_projection * http://en.wikipedia.org/wiki/3D_projection
* @class Camera
*/ */
function Camera() { function Camera() {
this.armLocation = new Point3d(); this.armLocation = new Point3d();
@ -50,6 +50,7 @@ Camera.prototype.setOffset = function(x, y) {
/** /**
* Get camera offset by horizontal and vertical * Get camera offset by horizontal and vertical
* @returns {number}
*/ */
Camera.prototype.getOffset = function() { Camera.prototype.getOffset = function() {
return this.cameraOffset; return this.cameraOffset;

+ 20
- 5
lib/graph3d/DataGroup.js View File

@ -32,10 +32,11 @@ function DataGroup() {
* the given instance. * the given instance.
* TODO: Pass settings only instead. * TODO: Pass settings only instead.
* *
* @param {Graph3D} graph3d Reference to the calling Graph3D instance.
* @param {vis.Graph3D} graph3d Reference to the calling Graph3D instance.
* @param {Array | DataSet | DataView} rawData The data containing the items for * @param {Array | DataSet | DataView} rawData The data containing the items for
* the Graph. * the Graph.
* @param {Number} style Style Number * @param {Number} style Style Number
* @returns {Array<Object>}
*/ */
DataGroup.prototype.initializeData = function(graph3d, rawData, style) { DataGroup.prototype.initializeData = function(graph3d, rawData, style) {
if (rawData === undefined) return; if (rawData === undefined) return;
@ -142,8 +143,9 @@ DataGroup.prototype.initializeData = function(graph3d, rawData, style) {
* @private * @private
* *
* @param {'x'|'y'|'z'} column The data column to process * @param {'x'|'y'|'z'} column The data column to process
* @param {Graph3D} graph3d Reference to the calling Graph3D instance;
* @param {vis.Graph3D} graph3d Reference to the calling Graph3D instance;
* required for access to settings * required for access to settings
* @returns {Object}
*/ */
DataGroup.prototype._collectRangeSettings = function(column, graph3d) { DataGroup.prototype._collectRangeSettings = function(column, graph3d) {
var index = ['x', 'y', 'z'].indexOf(column); var index = ['x', 'y', 'z'].indexOf(column);
@ -162,7 +164,7 @@ DataGroup.prototype._collectRangeSettings = function(column, graph3d) {
range_label: column + 'Range', // Name of instance field to write to range_label: column + 'Range', // Name of instance field to write to
step_label : column + 'Step' // Name of instance field to write to step_label : column + 'Step' // Name of instance field to write to
}; };
}
};
/** /**
@ -278,7 +280,7 @@ DataGroup.prototype.getColumnRange = function(data, column) {
*/ */
DataGroup.prototype.getNumberOfRows = function() { DataGroup.prototype.getNumberOfRows = function() {
return this.dataTable.length; return this.dataTable.length;
}
};
/** /**
@ -289,6 +291,11 @@ DataGroup.prototype.getNumberOfRows = function() {
* Because it's possible that only defaultMin or defaultMax is set, it's better * Because it's possible that only defaultMin or defaultMax is set, it's better
* to pass in a range already set with the min/max set from the data. Otherwise, * to pass in a range already set with the min/max set from the data. Otherwise,
* it's quite hard to process the min/max properly. * it's quite hard to process the min/max properly.
*
* @param {vis.Range} range
* @param {number} [defaultMin=range.min]
* @param {number} [defaultMax=range.max]
* @private
*/ */
DataGroup.prototype._setRangeDefaults = function (range, defaultMin, defaultMax) { DataGroup.prototype._setRangeDefaults = function (range, defaultMin, defaultMax) {
if (defaultMin !== undefined) { if (defaultMin !== undefined) {
@ -318,6 +325,8 @@ DataGroup.prototype.getDataSet = function() {
/** /**
* Return all data values as a list of Point3d objects * Return all data values as a list of Point3d objects
* @param {Array<Object>} data
* @returns {Array<Object>}
*/ */
DataGroup.prototype.getDataPoints = function(data) { DataGroup.prototype.getDataPoints = function(data) {
var dataPoints = []; var dataPoints = [];
@ -350,6 +359,8 @@ DataGroup.prototype.getDataPoints = function(data) {
* Copy all values from the data table to a matrix. * Copy all values from the data table to a matrix.
* *
* The provided values are supposed to form a grid of (x,y) positions. * The provided values are supposed to form a grid of (x,y) positions.
* @param {Array<Object>} data
* @returns {Array<Object>}
* @private * @private
*/ */
DataGroup.prototype.initDataAsMatrix = function(data) { DataGroup.prototype.initDataAsMatrix = function(data) {
@ -394,11 +405,13 @@ DataGroup.prototype.initDataAsMatrix = function(data) {
} }
return dataPoints; return dataPoints;
}
};
/** /**
* Return common information, if present * Return common information, if present
*
* @returns {string}
*/ */
DataGroup.prototype.getInfo = function() { DataGroup.prototype.getInfo = function() {
var dataFilter = this.dataFilter; var dataFilter = this.dataFilter;
@ -453,6 +466,8 @@ DataGroup.prototype._getDataPoints = function (data) {
* Check if the state is consistent for the use of the value field. * Check if the state is consistent for the use of the value field.
* *
* Throws if a problem is detected. * Throws if a problem is detected.
*
* @param {Array<Object>} data
* @private * @private
*/ */
DataGroup.prototype._checkValueField = function (data) { DataGroup.prototype._checkValueField = function (data) {

+ 4
- 0
lib/graph3d/Filter.js View File

@ -146,6 +146,8 @@ Filter.prototype._getDataPoints = function(index) {
/** /**
* Set a callback function when the filter is fully loaded. * Set a callback function when the filter is fully loaded.
*
* @param {function} callback
*/ */
Filter.prototype.setOnLoadCallback = function(callback) { Filter.prototype.setOnLoadCallback = function(callback) {
this.onLoadCallback = callback; this.onLoadCallback = callback;
@ -168,6 +170,8 @@ Filter.prototype.selectValue = function(index) {
/** /**
* Load all filtered rows in the background one by one * Load all filtered rows in the background one by one
* Start this method without providing an index! * Start this method without providing an index!
*
* @param {number} [index=0]
*/ */
Filter.prototype.loadInBackground = function(index) { Filter.prototype.loadInBackground = function(index) {
if (index === undefined) if (index === undefined)

+ 153
- 17
lib/graph3d/Graph3d.js View File

@ -135,11 +135,11 @@ Graph3d.DEFAULTS = {
/** /**
* @constructor Graph3d
* Graph3d displays data in 3d. * Graph3d displays data in 3d.
* *
* Graph3d is developed in javascript as a Google Visualization Chart. * Graph3d is developed in javascript as a Google Visualization Chart.
* *
* @constructor Graph3d
* @param {Element} container The DOM element in which the Graph3d will * @param {Element} container The DOM element in which the Graph3d will
* be created. Normally a div element. * be created. Normally a div element.
* @param {DataSet | DataView | Array} [data] * @param {DataSet | DataView | Array} [data]
@ -304,6 +304,9 @@ Graph3d.prototype._convertTranslationToScreen = function(translation) {
/** /**
* Calculate the translations and screen positions of all points * Calculate the translations and screen positions of all points
*
* @param {Array<Point3d>} points
* @private
*/ */
Graph3d.prototype._calcTranslations = function(points) { Graph3d.prototype._calcTranslations = function(points) {
for (var i = 0; i < points.length; i++) { for (var i = 0; i < points.length; i++) {
@ -355,6 +358,9 @@ Graph3d.prototype._initializeRanges = function() {
/** /**
* Return all data values as a list of Point3d objects * Return all data values as a list of Point3d objects
*
* @param {vis.DataSet} data
* @returns {Array<Object>}
*/ */
Graph3d.prototype.getDataPoints = function(data) { Graph3d.prototype.getDataPoints = function(data) {
var dataPoints = []; var dataPoints = [];
@ -516,6 +522,10 @@ Graph3d.prototype.create = function () {
/** /**
* Set a new size for the graph * Set a new size for the graph
*
* @param {number} width
* @param {number} height
* @private
*/ */
Graph3d.prototype._setSize = function(width, height) { Graph3d.prototype._setSize = function(width, height) {
this.frame.style.width = width; this.frame.style.width = width;
@ -608,6 +618,9 @@ Graph3d.prototype.getCameraPosition = function() {
/** /**
* Load data into the 3D Graph * Load data into the 3D Graph
*
* @param {vis.DataSet} data
* @private
*/ */
Graph3d.prototype._readData = function(data) { Graph3d.prototype._readData = function(data) {
// read the data // read the data
@ -723,6 +736,9 @@ Graph3d.prototype.redraw = function() {
/** /**
* Get drawing context without exposing canvas * Get drawing context without exposing canvas
*
* @returns {CanvasRenderingContext2D}
* @private
*/ */
Graph3d.prototype._getContext = function() { Graph3d.prototype._getContext = function() {
var canvas = this.frame.canvas; var canvas = this.frame.canvas;
@ -753,6 +769,9 @@ Graph3d.prototype._dotSize = function() {
/** /**
* Get legend width * Get legend width
*
* @returns {*}
* @private
*/ */
Graph3d.prototype._getLegendWidth = function() { Graph3d.prototype._getLegendWidth = function() {
var width; var width;
@ -767,7 +786,7 @@ Graph3d.prototype._getLegendWidth = function() {
width = 20; width = 20;
} }
return width; return width;
}
};
/** /**
@ -957,6 +976,12 @@ Graph3d.prototype._redrawInfo = function() {
* Draw a line between 2d points 'from' and 'to'. * Draw a line between 2d points 'from' and 'to'.
* *
* If stroke style specified, set that as well. * If stroke style specified, set that as well.
*
* @param {CanvasRenderingContext2D} ctx
* @param {vis.Point2d} from
* @param {vis.Point2d} to
* @param {string} [strokeStyle]
* @private
*/ */
Graph3d.prototype._line = function(ctx, from, to, strokeStyle) { Graph3d.prototype._line = function(ctx, from, to, strokeStyle) {
if (strokeStyle !== undefined) { if (strokeStyle !== undefined) {
@ -967,9 +992,16 @@ Graph3d.prototype._line = function(ctx, from, to, strokeStyle) {
ctx.moveTo(from.x, from.y); ctx.moveTo(from.x, from.y);
ctx.lineTo(to.x , to.y ); ctx.lineTo(to.x , to.y );
ctx.stroke(); ctx.stroke();
}
};
/**
*
* @param {CanvasRenderingContext2D} ctx
* @param {vis.Point3d} point3d
* @param {string} text
* @param {number} armAngle
* @param {number} [yMargin=0]
*/
Graph3d.prototype.drawAxisLabelX = function(ctx, point3d, text, armAngle, yMargin) { Graph3d.prototype.drawAxisLabelX = function(ctx, point3d, text, armAngle, yMargin) {
if (yMargin === undefined) { if (yMargin === undefined) {
yMargin = 0; yMargin = 0;
@ -993,9 +1025,17 @@ Graph3d.prototype.drawAxisLabelX = function(ctx, point3d, text, armAngle, yMargi
ctx.fillStyle = this.axisColor; ctx.fillStyle = this.axisColor;
ctx.fillText(text, point2d.x, point2d.y); ctx.fillText(text, point2d.x, point2d.y);
}
};
/**
*
* @param {CanvasRenderingContext2D} ctx
* @param {vis.Point3d} point3d
* @param {string} text
* @param {number} armAngle
* @param {number} [yMargin=0]
*/
Graph3d.prototype.drawAxisLabelY = function(ctx, point3d, text, armAngle, yMargin) { Graph3d.prototype.drawAxisLabelY = function(ctx, point3d, text, armAngle, yMargin) {
if (yMargin === undefined) { if (yMargin === undefined) {
yMargin = 0; yMargin = 0;
@ -1019,9 +1059,16 @@ Graph3d.prototype.drawAxisLabelY = function(ctx, point3d, text, armAngle, yMargi
ctx.fillStyle = this.axisColor; ctx.fillStyle = this.axisColor;
ctx.fillText(text, point2d.x, point2d.y); ctx.fillText(text, point2d.x, point2d.y);
}
};
/**
*
* @param {CanvasRenderingContext2D} ctx
* @param {vis.Point3d} point3d
* @param {string} text
* @param {number} [offset=0]
*/
Graph3d.prototype.drawAxisLabelZ = function(ctx, point3d, text, offset) { Graph3d.prototype.drawAxisLabelZ = function(ctx, point3d, text, offset) {
if (offset === undefined) { if (offset === undefined) {
offset = 0; offset = 0;
@ -1042,13 +1089,19 @@ Graph3d.prototype.drawAxisLabelZ = function(ctx, point3d, text, offset) {
* Draw a line between 2d points 'from' and 'to'. * Draw a line between 2d points 'from' and 'to'.
* *
* If stroke style specified, set that as well. * If stroke style specified, set that as well.
*
* @param {CanvasRenderingContext2D} ctx
* @param {vis.Point2d} from
* @param {vis.Point2d} to
* @param {string} [strokeStyle]
* @private
*/ */
Graph3d.prototype._line3d = function(ctx, from, to, strokeStyle) { Graph3d.prototype._line3d = function(ctx, from, to, strokeStyle) {
var from2d = this._convert3Dto2D(from); var from2d = this._convert3Dto2D(from);
var to2d = this._convert3Dto2D(to); var to2d = this._convert3Dto2D(to);
this._line(ctx, from2d, to2d, strokeStyle); this._line(ctx, from2d, to2d, strokeStyle);
}
};
/** /**
@ -1243,6 +1296,8 @@ Graph3d.prototype._redrawAxis = function() {
* @param {Number} H Hue, a value be between 0 and 360 * @param {Number} H Hue, a value be between 0 and 360
* @param {Number} S Saturation, a value between 0 and 1 * @param {Number} S Saturation, a value between 0 and 1
* @param {Number} V Value, a value between 0 and 1 * @param {Number} V Value, a value between 0 and 1
* @returns {string}
* @private
*/ */
Graph3d.prototype._hsv2rgb = function(H, S, V) { Graph3d.prototype._hsv2rgb = function(H, S, V) {
var R, G, B, C, Hi, X; var R, G, B, C, Hi, X;
@ -1266,6 +1321,12 @@ Graph3d.prototype._hsv2rgb = function(H, S, V) {
}; };
/**
*
* @param {vis.Point3d} point
* @returns {*}
* @private
*/
Graph3d.prototype._getStrokeWidth = function(point) { Graph3d.prototype._getStrokeWidth = function(point) {
if (point !== undefined) { if (point !== undefined) {
if (this.showPerspective) { if (this.showPerspective) {
@ -1287,6 +1348,14 @@ Graph3d.prototype._getStrokeWidth = function(point) {
/** /**
* Draw a bar element in the view with the given properties. * Draw a bar element in the view with the given properties.
*
* @param {CanvasRenderingContext2D} ctx
* @param {Object} point
* @param {number} xWidth
* @param {number} yWidth
* @param {string} color
* @param {string} borderColor
* @private
*/ */
Graph3d.prototype._redrawBar = function(ctx, point, xWidth, yWidth, color, borderColor) { Graph3d.prototype._redrawBar = function(ctx, point, xWidth, yWidth, color, borderColor) {
var surface; var surface;
@ -1364,9 +1433,10 @@ Graph3d.prototype._redrawBar = function(ctx, point, xWidth, yWidth, color, borde
/** /**
* Draw a polygon using the passed points and fill it with the passed style and stroke. * Draw a polygon using the passed points and fill it with the passed style and stroke.
* *
* @param points an array of points.
* @param fillStyle optional; the fill style to set
* @param strokeStyle optional; the stroke style to set
* @param {CanvasRenderingContext2D} ctx
* @param {Array<vis.Point3d>} points an array of points.
* @param {string} [fillStyle] the fill style to set
* @param {string} [strokeStyle] the stroke style to set
*/ */
Graph3d.prototype._polygon = function(ctx, points, fillStyle, strokeStyle) { Graph3d.prototype._polygon = function(ctx, points, fillStyle, strokeStyle) {
if (points.length < 2) { if (points.length < 2) {
@ -1394,7 +1464,12 @@ Graph3d.prototype._polygon = function(ctx, points, fillStyle, strokeStyle) {
/** /**
* @param size optional; if not specified use value from 'this._dotSize()`
* @param {CanvasRenderingContext2D} ctx
* @param {object} point
* @param {string} color
* @param {string} borderColor
* @param {number} [size=this._dotSize()]
* @private
*/ */
Graph3d.prototype._drawCircle = function(ctx, point, color, borderColor, size) { Graph3d.prototype._drawCircle = function(ctx, point, color, borderColor, size) {
var radius = this._calcRadius(point, size); var radius = this._calcRadius(point, size);
@ -1411,6 +1486,10 @@ Graph3d.prototype._drawCircle = function(ctx, point, color, borderColor, size) {
/** /**
* Determine the colors for the 'regular' graph styles. * Determine the colors for the 'regular' graph styles.
*
* @param {object} point
* @returns {{fill, border}}
* @private
*/ */
Graph3d.prototype._getColorsRegular = function(point) { Graph3d.prototype._getColorsRegular = function(point) {
// calculate Hue from the current value. At zMin the hue is 240, at zMax the hue is 0 // calculate Hue from the current value. At zMin the hue is 240, at zMax the hue is 0
@ -1433,6 +1512,9 @@ Graph3d.prototype._getColorsRegular = function(point) {
* The first option is useful when we have some pre-given legend, to which we have to adjust ourselves * The first option is useful when we have some pre-given legend, to which we have to adjust ourselves
* The second option is useful when we are interested in automatically setting the color, from some value, * The second option is useful when we are interested in automatically setting the color, from some value,
* using some color scale * using some color scale
* @param {object} point
* @returns {{fill: *, border: *}}
* @private
*/ */
Graph3d.prototype._getColorsColor = function(point) { Graph3d.prototype._getColorsColor = function(point) {
// calculate the color based on the value // calculate the color based on the value
@ -1457,6 +1539,9 @@ Graph3d.prototype._getColorsColor = function(point) {
/** /**
* Get the colors for the 'size' graph styles. * Get the colors for the 'size' graph styles.
* These styles are currently: 'bar-size' and 'dot-size' * These styles are currently: 'bar-size' and 'dot-size'
*
* @returns {{fill: *, border: (string|undefinedOptions.colorOptions.stroke|{string, undefined}|string|colorOptions.stroke|{string}|*)}}
* @private
*/ */
Graph3d.prototype._getColorsSize = function() { Graph3d.prototype._getColorsSize = function() {
return { return {
@ -1470,8 +1555,11 @@ Graph3d.prototype._getColorsSize = function() {
* Determine the size of a point on-screen, as determined by the * Determine the size of a point on-screen, as determined by the
* distance to the camera. * distance to the camera.
* *
* @param size the size that needs to be translated to screen coordinates.
* @param {Object} point
* @param {number} [size=this._dotSize()] the size that needs to be translated to screen coordinates.
* optional; if not passed, use the default point size. * optional; if not passed, use the default point size.
* @returns {number}
* @private
*/ */
Graph3d.prototype._calcRadius = function(point, size) { Graph3d.prototype._calcRadius = function(point, size) {
if (size === undefined) { if (size === undefined) {
@ -1500,6 +1588,10 @@ Graph3d.prototype._calcRadius = function(point, size) {
/** /**
* Draw single datapoint for graph style 'bar'. * Draw single datapoint for graph style 'bar'.
*
* @param {CanvasRenderingContext2D} ctx
* @param {Object} point
* @private
*/ */
Graph3d.prototype._redrawBarGraphPoint = function(ctx, point) { Graph3d.prototype._redrawBarGraphPoint = function(ctx, point) {
var xWidth = this.xBarWidth / 2; var xWidth = this.xBarWidth / 2;
@ -1512,6 +1604,10 @@ Graph3d.prototype._redrawBarGraphPoint = function(ctx, point) {
/** /**
* Draw single datapoint for graph style 'bar-color'. * Draw single datapoint for graph style 'bar-color'.
*
* @param {CanvasRenderingContext2D} ctx
* @param {Object} point
* @private
*/ */
Graph3d.prototype._redrawBarColorGraphPoint = function(ctx, point) { Graph3d.prototype._redrawBarColorGraphPoint = function(ctx, point) {
var xWidth = this.xBarWidth / 2; var xWidth = this.xBarWidth / 2;
@ -1524,6 +1620,10 @@ Graph3d.prototype._redrawBarColorGraphPoint = function(ctx, point) {
/** /**
* Draw single datapoint for graph style 'bar-size'. * Draw single datapoint for graph style 'bar-size'.
*
* @param {CanvasRenderingContext2D} ctx
* @param {Object} point
* @private
*/ */
Graph3d.prototype._redrawBarSizeGraphPoint = function(ctx, point) { Graph3d.prototype._redrawBarSizeGraphPoint = function(ctx, point) {
// calculate size for the bar // calculate size for the bar
@ -1539,6 +1639,10 @@ Graph3d.prototype._redrawBarSizeGraphPoint = function(ctx, point) {
/** /**
* Draw single datapoint for graph style 'dot'. * Draw single datapoint for graph style 'dot'.
*
* @param {CanvasRenderingContext2D} ctx
* @param {Object} point
* @private
*/ */
Graph3d.prototype._redrawDotGraphPoint = function(ctx, point) { Graph3d.prototype._redrawDotGraphPoint = function(ctx, point) {
var colors = this._getColorsRegular(point); var colors = this._getColorsRegular(point);
@ -1549,6 +1653,10 @@ Graph3d.prototype._redrawDotGraphPoint = function(ctx, point) {
/** /**
* Draw single datapoint for graph style 'dot-line'. * Draw single datapoint for graph style 'dot-line'.
*
* @param {CanvasRenderingContext2D} ctx
* @param {Object} point
* @private
*/ */
Graph3d.prototype._redrawDotLineGraphPoint = function(ctx, point) { Graph3d.prototype._redrawDotLineGraphPoint = function(ctx, point) {
// draw a vertical line from the XY-plane to the graph value // draw a vertical line from the XY-plane to the graph value
@ -1562,6 +1670,10 @@ Graph3d.prototype._redrawDotLineGraphPoint = function(ctx, point) {
/** /**
* Draw single datapoint for graph style 'dot-color'. * Draw single datapoint for graph style 'dot-color'.
*
* @param {CanvasRenderingContext2D} ctx
* @param {Object} point
* @private
*/ */
Graph3d.prototype._redrawDotColorGraphPoint = function(ctx, point) { Graph3d.prototype._redrawDotColorGraphPoint = function(ctx, point) {
var colors = this._getColorsColor(point); var colors = this._getColorsColor(point);
@ -1572,6 +1684,10 @@ Graph3d.prototype._redrawDotColorGraphPoint = function(ctx, point) {
/** /**
* Draw single datapoint for graph style 'dot-size'. * Draw single datapoint for graph style 'dot-size'.
*
* @param {CanvasRenderingContext2D} ctx
* @param {Object} point
* @private
*/ */
Graph3d.prototype._redrawDotSizeGraphPoint = function(ctx, point) { Graph3d.prototype._redrawDotSizeGraphPoint = function(ctx, point) {
var dotSize = this._dotSize(); var dotSize = this._dotSize();
@ -1589,6 +1705,10 @@ Graph3d.prototype._redrawDotSizeGraphPoint = function(ctx, point) {
/** /**
* Draw single datapoint for graph style 'surface'. * Draw single datapoint for graph style 'surface'.
*
* @param {CanvasRenderingContext2D} ctx
* @param {Object} point
* @private
*/ */
Graph3d.prototype._redrawSurfaceGraphPoint = function(ctx, point) { Graph3d.prototype._redrawSurfaceGraphPoint = function(ctx, point) {
var right = point.pointRight; var right = point.pointRight;
@ -1651,6 +1771,11 @@ Graph3d.prototype._redrawSurfaceGraphPoint = function(ctx, point) {
/** /**
* Helper method for _redrawGridGraphPoint() * Helper method for _redrawGridGraphPoint()
*
* @param {CanvasRenderingContext2D} ctx
* @param {Object} from
* @param {Object} to
* @private
*/ */
Graph3d.prototype._drawGridLine = function(ctx, from, to) { Graph3d.prototype._drawGridLine = function(ctx, from, to) {
if (from === undefined || to === undefined) { if (from === undefined || to === undefined) {
@ -1669,6 +1794,10 @@ Graph3d.prototype._drawGridLine = function(ctx, from, to) {
/** /**
* Draw single datapoint for graph style 'Grid'. * Draw single datapoint for graph style 'Grid'.
*
* @param {CanvasRenderingContext2D} ctx
* @param {Object} point
* @private
*/ */
Graph3d.prototype._redrawGridGraphPoint = function(ctx, point) { Graph3d.prototype._redrawGridGraphPoint = function(ctx, point) {
this._drawGridLine(ctx, point, point.pointRight); this._drawGridLine(ctx, point, point.pointRight);
@ -1678,6 +1807,10 @@ Graph3d.prototype._redrawGridGraphPoint = function(ctx, point) {
/** /**
* Draw single datapoint for graph style 'line'. * Draw single datapoint for graph style 'line'.
*
* @param {CanvasRenderingContext2D} ctx
* @param {Object} point
* @private
*/ */
Graph3d.prototype._redrawLineGraphPoint = function(ctx, point) { Graph3d.prototype._redrawLineGraphPoint = function(ctx, point) {
if (point.pointNext === undefined) { if (point.pointNext === undefined) {
@ -1832,7 +1965,7 @@ Graph3d.prototype._onMouseMove = function (event) {
/** /**
* Stop moving operating. * Stop moving operating.
* This function activated from within the funcion Graph.mouseDown(). * This function activated from within the funcion Graph.mouseDown().
* @param {event} event The event
* @param {Event} event The event
*/ */
Graph3d.prototype._onMouseUp = function (event) { Graph3d.prototype._onMouseUp = function (event) {
this.frame.style.cursor = 'auto'; this.frame.style.cursor = 'auto';
@ -1845,7 +1978,7 @@ Graph3d.prototype._onMouseUp = function (event) {
}; };
/** /**
* @param {event} event The event
* @param {Event} event The event
*/ */
Graph3d.prototype._onClick = function (event) { Graph3d.prototype._onClick = function (event) {
if (!this.onclick_callback) if (!this.onclick_callback)
@ -1918,6 +2051,7 @@ Graph3d.prototype._onTooltip = function (event) {
/** /**
* Event handler for touchstart event on mobile devices * Event handler for touchstart event on mobile devices
* @param {Event} event The event
*/ */
Graph3d.prototype._onTouchStart = function(event) { Graph3d.prototype._onTouchStart = function(event) {
this.touchDown = true; this.touchDown = true;
@ -1933,6 +2067,7 @@ Graph3d.prototype._onTouchStart = function(event) {
/** /**
* Event handler for touchmove event on mobile devices * Event handler for touchmove event on mobile devices
* @param {Event} event The event
*/ */
Graph3d.prototype._onTouchMove = function(event) { Graph3d.prototype._onTouchMove = function(event) {
this._onMouseMove(event); this._onMouseMove(event);
@ -1940,6 +2075,7 @@ Graph3d.prototype._onTouchMove = function(event) {
/** /**
* Event handler for touchend event on mobile devices * Event handler for touchend event on mobile devices
* @param {Event} event The event
*/ */
Graph3d.prototype._onTouchEnd = function(event) { Graph3d.prototype._onTouchEnd = function(event) {
this.touchDown = false; this.touchDown = false;
@ -1954,7 +2090,7 @@ Graph3d.prototype._onTouchEnd = function(event) {
/** /**
* Event handler for mouse wheel event, used to zoom the graph * Event handler for mouse wheel event, used to zoom the graph
* Code from http://adomas.org/javascript-mouse-wheel/ * Code from http://adomas.org/javascript-mouse-wheel/
* @param {event} event The event
* @param {Event} event The event
*/ */
Graph3d.prototype._onWheel = function(event) { Graph3d.prototype._onWheel = function(event) {
if (!event) /* For IE. */ if (!event) /* For IE. */
@ -1996,8 +2132,8 @@ Graph3d.prototype._onWheel = function(event) {
/** /**
* Test whether a point lies inside given 2D triangle * Test whether a point lies inside given 2D triangle
* *
* @param {Point2d} point
* @param {Point2d[]} triangle
* @param {vis.Point2d} point
* @param {vis.Point2d[]} triangle
* @returns {boolean} true if given point lies inside or on the edge of the * @returns {boolean} true if given point lies inside or on the edge of the
* triangle, false otherwise * triangle, false otherwise
* @private * @private

+ 34
- 10
lib/graph3d/Settings.js View File

@ -107,6 +107,9 @@ var DEFAULTS = undefined;
* Check if given hash is empty. * Check if given hash is empty.
* *
* Source: http://stackoverflow.com/a/679937 * Source: http://stackoverflow.com/a/679937
*
* @param {object} obj
* @returns {boolean}
*/ */
function isEmpty(obj) { function isEmpty(obj) {
for(var prop in obj) { for(var prop in obj) {
@ -122,6 +125,9 @@ function isEmpty(obj) {
* Make first letter of parameter upper case. * Make first letter of parameter upper case.
* *
* Source: http://stackoverflow.com/a/1026087 * Source: http://stackoverflow.com/a/1026087
*
* @param {string} str
* @returns {string}
*/ */
function capitalize(str) { function capitalize(str) {
if (str === undefined || str === "" || typeof str != "string") { if (str === undefined || str === "" || typeof str != "string") {
@ -134,6 +140,10 @@ function capitalize(str) {
/** /**
* Add a prefix to a field name, taking style guide into account * Add a prefix to a field name, taking style guide into account
*
* @param {string} prefix
* @param {string} fieldName
* @returns {string}
*/ */
function prefixFieldName(prefix, fieldName) { function prefixFieldName(prefix, fieldName) {
if (prefix === undefined || prefix === "") { if (prefix === undefined || prefix === "") {
@ -155,8 +165,10 @@ function prefixFieldName(prefix, fieldName) {
* *
* Only the fields mentioned in array 'fields' will be handled. * Only the fields mentioned in array 'fields' will be handled.
* *
* @param fields array with names of fields to copy
* @param prefix optional; prefix to use for the target fields.
* @param {object} src
* @param {object} dst
* @param {array<string>} fields array with names of fields to copy
* @param {string} [prefix] prefix to use for the target fields.
*/ */
function forceCopy(src, dst, fields, prefix) { function forceCopy(src, dst, fields, prefix) {
var srcKey; var srcKey;
@ -177,8 +189,10 @@ function forceCopy(src, dst, fields, prefix) {
* Only the fields mentioned in array 'fields' will be copied over, * Only the fields mentioned in array 'fields' will be copied over,
* and only if these are actually defined. * and only if these are actually defined.
* *
* @param fields array with names of fields to copy
* @param prefix optional; prefix to use for the target fields.
* @param {object} src
* @param {object} dst
* @param {array<string>} fields array with names of fields to copy
* @param {string} [prefix] prefix to use for the target fields.
*/ */
function safeCopy(src, dst, fields, prefix) { function safeCopy(src, dst, fields, prefix) {
var srcKey; var srcKey;
@ -203,6 +217,8 @@ function safeCopy(src, dst, fields, prefix) {
* further handling. * further handling.
* *
* For now, dst is assumed to be a Graph3d instance. * For now, dst is assumed to be a Graph3d instance.
* @param {object} src
* @param {object} dst
*/ */
function setDefaults(src, dst) { function setDefaults(src, dst) {
if (src === undefined || isEmpty(src)) { if (src === undefined || isEmpty(src)) {
@ -232,8 +248,8 @@ function setDefaults(src, dst) {
/** /**
* *
* @param options {Object}
* @param dst
* @param {object} options
* @param {object} dst
*/ */
function setOptions(options, dst) { function setOptions(options, dst) {
if (options === undefined) { if (options === undefined) {
@ -259,6 +275,9 @@ function setOptions(options, dst) {
* Special handling for certain parameters * Special handling for certain parameters
* *
* 'Special' here means: setting requires more than a simple copy * 'Special' here means: setting requires more than a simple copy
*
* @param {object} src
* @param {object} dst
*/ */
function setSpecialSettings(src, dst) { function setSpecialSettings(src, dst) {
if (src.backgroundColor !== undefined) { if (src.backgroundColor !== undefined) {
@ -290,6 +309,9 @@ function setSpecialSettings(src, dst) {
* *
* This depends on the value of the style fields, so it must be called * This depends on the value of the style fields, so it must be called
* after the style field has been initialized. * after the style field has been initialized.
*
* @param {boolean} showLegend
* @param {object} dst
*/ */
function setShowLegend(showLegend, dst) { function setShowLegend(showLegend, dst) {
if (showLegend === undefined) { if (showLegend === undefined) {
@ -331,7 +353,8 @@ function getStyleNumberByName(styleName) {
/** /**
* Check if given number is a valid style number. * Check if given number is a valid style number.
* *
* @return true if valid, false otherwise
* @param {String | Number} style
* @return {boolean} true if valid, false otherwise
*/ */
function checkStyleNumber(style) { function checkStyleNumber(style) {
var valid = false; var valid = false;
@ -349,7 +372,7 @@ function checkStyleNumber(style) {
/** /**
* *
* @param {String | Number} style * @param {String | Number} style
* @param dst
* @param {Object} dst
*/ */
function setStyle(style, dst) { function setStyle(style, dst) {
if (style === undefined) { if (style === undefined) {
@ -380,6 +403,7 @@ function setStyle(style, dst) {
/** /**
* Set the background styling for the graph * Set the background styling for the graph
* @param {string | {fill: string, stroke: string, strokeWidth: string}} backgroundColor * @param {string | {fill: string, stroke: string, strokeWidth: string}} backgroundColor
* @param {Object} dst
*/ */
function setBackgroundColor(backgroundColor, dst) { function setBackgroundColor(backgroundColor, dst) {
var fill = 'white'; var fill = 'white';
@ -409,7 +433,7 @@ function setBackgroundColor(backgroundColor, dst) {
/** /**
* *
* @param {String | Object} dataColor * @param {String | Object} dataColor
* @param dst
* @param {Object} dst
*/ */
function setDataColor(dataColor, dst) { function setDataColor(dataColor, dst) {
if (dataColor === undefined) { if (dataColor === undefined) {
@ -440,7 +464,7 @@ function setDataColor(dataColor, dst) {
/** /**
* *
* @param {Object} cameraPosition * @param {Object} cameraPosition
* @param dst
* @param {Object} dst
*/ */
function setCameraPosition(cameraPosition, dst) { function setCameraPosition(cameraPosition, dst) {
var camPos = cameraPosition; var camPos = cameraPosition;

+ 6
- 3
lib/graph3d/Slider.js View File

@ -1,9 +1,9 @@
var util = require('../util'); var util = require('../util');
/** /**
* @constructor Slider
*
* An html slider control with start/stop/prev/next buttons * An html slider control with start/stop/prev/next buttons
*
* @constructor Slider
* @param {Element} container The element where the slider will be created * @param {Element} container The element where the slider will be created
* @param {Object} options Available options: * @param {Object} options Available options:
* {boolean} visible If true (default) the * {boolean} visible If true (default) the
@ -167,6 +167,8 @@ Slider.prototype.stop = function() {
/** /**
* Set a callback function which will be triggered when the value of the * Set a callback function which will be triggered when the value of the
* slider bar has changed. * slider bar has changed.
*
* @param {function} callback
*/ */
Slider.prototype.setOnChangeCallback = function(callback) { Slider.prototype.setOnChangeCallback = function(callback) {
this.onChangeCallback = callback; this.onChangeCallback = callback;
@ -190,9 +192,10 @@ Slider.prototype.getPlayInterval = function() {
/** /**
* Set looping on or off * Set looping on or off
* @pararm {boolean} doLoop If true, the slider will jump to the start when
* @param {boolean} doLoop If true, the slider will jump to the start when
* the end is passed, and will jump to the end * the end is passed, and will jump to the end
* when the start is passed. * when the start is passed.
*
*/ */
Slider.prototype.setPlayLoop = function(doLoop) { Slider.prototype.setPlayLoop = function(doLoop) {
this.playLoop = doLoop; this.playLoop = doLoop;

+ 5
- 0
lib/graph3d/StepNumber.js View File

@ -40,6 +40,9 @@ function StepNumber(start, end, step, prettyStep) {
* Check for input values, to prevent disasters from happening * Check for input values, to prevent disasters from happening
* *
* Source: http://stackoverflow.com/a/1830844 * Source: http://stackoverflow.com/a/1830844
*
* @param {string} n
* @returns {boolean}
*/ */
StepNumber.prototype.isNumeric = function(n) { StepNumber.prototype.isNumeric = function(n) {
return !isNaN(parseFloat(n)) && isFinite(n); return !isNaN(parseFloat(n)) && isFinite(n);
@ -143,6 +146,8 @@ StepNumber.prototype.getStep = function () {
* *
* Parameters checkFirst is optional, default false. * Parameters checkFirst is optional, default false.
* If set to true, move the current value one step if smaller than start. * If set to true, move the current value one step if smaller than start.
*
* @param {boolean} [checkFirst=false]
*/ */
StepNumber.prototype.start = function(checkFirst) { StepNumber.prototype.start = function(checkFirst) {
if (checkFirst === undefined) { if (checkFirst === undefined) {

Loading…
Cancel
Save