From f2b1eed9d47f55ea0cd854aae435b458013f10ab Mon Sep 17 00:00:00 2001 From: jos Date: Fri, 6 Jun 2014 11:08:21 +0200 Subject: [PATCH] Renamed event `camerapositionchange` to `cameraPositionChange` --- docs/graph3d.html | 22 ++++++++++--------- examples/graph3d/example01_basis.html | 4 ++-- examples/graph3d/example02_camera.html | 10 ++++----- examples/graph3d/example10_styles.html | 6 +++--- src/graph3d/{graph3d.js => Graph3d.js} | 29 ++++++++++++++++++-------- 5 files changed, 42 insertions(+), 29 deletions(-) rename src/graph3d/{graph3d.js => Graph3d.js} (99%) diff --git a/docs/graph3d.html b/docs/graph3d.html index ddd3fc00..534fa69f 100644 --- a/docs/graph3d.html +++ b/docs/graph3d.html @@ -62,7 +62,7 @@ // Called when the Visualization API is loaded. function drawVisualization() { // Create and populate a data table. - var data = []; + var data = new vis.DataSet(); // create some nice looking data with sin/cos var steps = 50; // number of datapoints will be steps*steps var axisMax = 314; @@ -70,7 +70,7 @@ for (var x = 0; x < axisMax; x+=axisStep) { for (var y = 0; y < axisMax; y+=axisStep) { var value = custom(x, y); - data.push({ + data.add({ x: x, y: y, z: value, @@ -98,7 +98,7 @@ graph3d.draw(data, options); // subscribe to event - graph3d.on("camerapositionchange", function(event) {console.log(event);}); + graph3d.on("cameraPositionChange", function(event) {console.log(event);}); } </script> </head> @@ -131,8 +131,10 @@

Data Format

- Graph3d requires a vis DataSet. JSON objects are added to this DataSet by using the add() function. - These JSON objects have 5 fields, of which 2 are optional. These are described below. + Graph3d can load data from an Array, a DataSet or a DataView. + JSON objects are added to this DataSet by using the add() function. + Data points must have properties x, y, and z, + and can optionally have a property style and filter.

Definition

@@ -174,7 +176,7 @@ filter - anytype + * no Filter values used for the animation. This column may have any type, such as a number, string, or Date. @@ -586,18 +588,18 @@ options = {

Graph3d fires events after the camera position has been changed. The event can be catched by creating a listener. - Here an example on how to catch a camerapositionchange event. + Here an example on how to catch a cameraPositionChange event. 

-function oncamerapositionchange(event) {
+function onCameraPositionChange(event) {
   alert("The camera position changed to:\n" +
         "Horizontal: " + event.horizontal + "\n" +
         "Vertical: " + event.vertical + "\n" +
         "Distance: " + event.distance);
 }
 // assuming var graph3d = new vis.Graph3d(document.getElementById('mygraph'));
-graph3d.on("camerapositionchange",oncamerapositionchange);
+graph3d.on("cameraPositionChange", onCameraPositionChange);

@@ -616,7 +618,7 @@ graph3d.on("camerapositionchange",oncamerapositionchange); - camerapositionchange + cameraPositionChange The camera position changed. Fired after the user modified the camera position by moving (dragging) the graph, or by zooming (scrolling), but not after a call to setCameraPosition method. diff --git a/examples/graph3d/example01_basis.html b/examples/graph3d/example01_basis.html index d3c18e57..91b1e77c 100644 --- a/examples/graph3d/example01_basis.html +++ b/examples/graph3d/example01_basis.html @@ -20,7 +20,7 @@ // Called when the Visualization API is loaded. function drawVisualization() { // Create and populate a data table. - var data = []; + var data = new vis.DataSet(); // create some nice looking data with sin/cos var steps = 50; // number of datapoints will be steps*steps var axisMax = 314; @@ -28,7 +28,7 @@ for (var x = 0; x < axisMax; x+=axisStep) { for (var y = 0; y < axisMax; y+=axisStep) { var value = custom(x,y); - data.push({x:x,y:y,z:value,style:value}); + data.add({x:x,y:y,z:value,style:value}); } } diff --git a/examples/graph3d/example02_camera.html b/examples/graph3d/example02_camera.html index 771e4f49..a55b66e9 100644 --- a/examples/graph3d/example02_camera.html +++ b/examples/graph3d/example02_camera.html @@ -19,7 +19,7 @@ } // callback function, called when the camera position has changed - function oncamerapositionchange() { + function onCameraPositionChange() { // adjust the values of startDate and endDate var pos = graph.getCameraPosition(); document.getElementById('horizontal').value = parseFloat(pos.horizontal.toFixed(3)); @@ -28,7 +28,7 @@ } // set the camera position - function setcameraposition() { + function setCameraPosition() { var horizontal = parseFloat(document.getElementById('horizontal').value); var vertical = parseFloat(document.getElementById('vertical').value); var distance = parseFloat(document.getElementById('distance').value); @@ -39,7 +39,7 @@ graph.setCameraPosition(pos); // retrieve the camera position again, to get the applied values - oncamerapositionchange(); + onCameraPositionChange(); } // Called when the Visualization API is loaded. @@ -76,7 +76,7 @@ // Draw our graph with the created data and options graph.draw(data, options); - graph.on("camerapositionchange", oncamerapositionchange); + graph.on("cameraPositionChange", onCameraPositionChange); //graph.redraw(); } @@ -99,7 +99,7 @@ - + diff --git a/examples/graph3d/example10_styles.html b/examples/graph3d/example10_styles.html index 2d1886b3..43e1102c 100644 --- a/examples/graph3d/example10_styles.html +++ b/examples/graph3d/example10_styles.html @@ -26,7 +26,7 @@ var withValue = ['bar-color', 'bar-size', 'dot-size', 'dot-color'].indexOf(style) != -1; // Create and populate a data table. - var data = new vis.DataSet(); + var data = []; // create some nice looking data with sin/cos var steps = 5; // number of datapoints will be steps*steps @@ -37,10 +37,10 @@ var z = custom(x,y); if (withValue) { var value = (y - x); - data.add({x:x, y:y, z: z, style:value}); + data.push({x:x, y:y, z: z, style:value}); } else { - data.add({x:x, y:y, z: z}); + data.push({x:x, y:y, z: z}); } } } diff --git a/src/graph3d/graph3d.js b/src/graph3d/Graph3d.js similarity index 99% rename from src/graph3d/graph3d.js rename to src/graph3d/Graph3d.js index a202041d..4230e30d 100644 --- a/src/graph3d/graph3d.js +++ b/src/graph3d/Graph3d.js @@ -556,8 +556,7 @@ Graph3d.prototype.getColumnRange = function(data,column) { /** * Initialize the data from the data table. Calculate minimum and maximum values * and column index values - * @param {DataSet} data The data containing the events - * for the Graph. + * @param {Array | DataSet | DataView} rawData The data containing the items for the Graph. * @param {Number} style Style Number */ Graph3d.prototype._dataInitialize = function (rawData, style) { @@ -565,10 +564,17 @@ Graph3d.prototype._dataInitialize = function (rawData, style) { if (rawData === undefined) return; + if (Array.isArray(rawData)) { + rawData = new DataSet(rawData); + } + var data; - if (rawData instanceof DataSet) { + if (rawData instanceof DataSet || rawData instanceof DataView) { data = rawData.get(); } + else { + throw new Error('Array, DataSet, or DataView expected'); + } if (data.length == 0) return; @@ -665,7 +671,7 @@ Graph3d.prototype._dataInitialize = function (rawData, style) { /** * Filter the data based on the current filter - * @param {DataSet} data + * @param {Array} data * @return {Array} dataPoints Array with point objects which can be drawn on screen */ Graph3d.prototype._getDataPoints = function (data) { @@ -985,7 +991,7 @@ Graph3d.prototype._readData = function(data) { /** * Redraw the Graph. This needs to be executed after the start and/or * end time are changed, or when data is added or removed dynamically. - * @param {DataSet} data Optional, new data table + * @param {DataSet} [data] Optional, new data table */ Graph3d.prototype.redraw = function(data) { // load the data if needed @@ -2002,9 +2008,9 @@ Graph3d.prototype._onMouseMove = function (event) { this.camera.setArmRotation(horizontalNew, verticalNew); this.redraw(); - // fire an oncamerapositionchange event + // fire a cameraPositionChange event var parameters = this.getCameraPosition(); - this.emit('camerapositionchange', parameters); + this.emit('cameraPositionChange', parameters); G3DpreventDefault(event); }; @@ -2143,9 +2149,9 @@ Graph3d.prototype._onWheel = function(event) { this._hideTooltip(); } - // fire an oncamerapositionchange event + // fire a cameraPositionChange event var parameters = this.getCameraPosition(); - this.emit('camerapositionchange', parameters); + this.emit('cameraPositionChange', parameters); // Prevent default actions caused by mouse wheel. // That might be ugly, but we handle scrolls somehow @@ -2534,6 +2540,11 @@ function Filter (data, column, graph) { // read all distinct values and select the first one this.values = graph.getDistinctValues(data.get(), this.column); + // sort both numeric and string values correctly + this.values.sort(function (a, b) { + return a > b ? 1 : a < b ? -1 : 0; + }); + if (this.values.length > 0) { this.selectValue(0); }