Browse Source

Fixed #1596: correct clean up of manipulation dom elements.

codeClimate
Alex de Mulder 8 years ago
parent
commit
84b65fdd6c
3 changed files with 180 additions and 172 deletions
  1. +1
    -0
      HISTORY.md
  2. +178
    -171
      dist/vis.js
  3. +1
    -1
      lib/network/modules/ManipulationSystem.js

+ 1
- 0
HISTORY.md View File

@ -14,6 +14,7 @@ http://visjs.org
- Fixed #1334 (again): Network now ignores scroll when interaction:zoomView is false. - Fixed #1334 (again): Network now ignores scroll when interaction:zoomView is false.
- Fixed #1588: destroy now unsubscribed from the dataset. - Fixed #1588: destroy now unsubscribed from the dataset.
- Fixed #1584: Navigation buttons broken. - Fixed #1584: Navigation buttons broken.
- Fixed #1596: correct clean up of manipulation dom elements.
### Timeline ### Timeline

+ 178
- 171
dist/vis.js View File

@ -5,7 +5,7 @@
* A dynamic, browser-based visualization library. * A dynamic, browser-based visualization library.
* *
* @version 4.12.1-SNAPSHOT * @version 4.12.1-SNAPSHOT
* @date 2016-01-19
* @date 2016-01-22
* *
* @license * @license
* Copyright (C) 2011-2016 Almende B.V, http://almende.com * Copyright (C) 2011-2016 Almende B.V, http://almende.com
@ -10648,6 +10648,27 @@ return /******/ (function(modules) { // webpackBootstrap
me.emit('contextmenu', me.getEventProperties(event)); me.emit('contextmenu', me.getEventProperties(event));
}; };
//Single time autoscale/fit
this.fitDone = false;
this.on('changed', function () {
if (this.itemsData == null) return;
if (!me.fitDone) {
me.fitDone = true;
if (me.options.start != undefined || me.options.end != undefined) {
if (me.options.start == undefined || me.options.end == undefined) {
var range = me.getItemRange();
}
var start = me.options.start != undefined ? me.options.start : range.min;
var end = me.options.end != undefined ? me.options.end : range.max;
me.setWindow(start, end, { animation: false });
} else {
me.fit({ animation: false });
}
}
});
// apply options // apply options
if (options) { if (options) {
this.setOptions(options); this.setOptions(options);
@ -10720,8 +10741,6 @@ return /******/ (function(modules) { // webpackBootstrap
* @param {vis.DataSet | Array | null} items * @param {vis.DataSet | Array | null} items
*/ */
Timeline.prototype.setItems = function (items) { Timeline.prototype.setItems = function (items) {
var initialLoad = this.itemsData == null;
// convert to type DataSet when needed // convert to type DataSet when needed
var newDataSet; var newDataSet;
if (!items) { if (!items) {
@ -10742,20 +10761,7 @@ return /******/ (function(modules) { // webpackBootstrap
this.itemsData = newDataSet; this.itemsData = newDataSet;
this.itemSet && this.itemSet.setItems(newDataSet); this.itemSet && this.itemSet.setItems(newDataSet);
if (initialLoad) {
if (this.options.start != undefined || this.options.end != undefined) {
if (this.options.start == undefined || this.options.end == undefined) {
var range = this.getItemRange();
}
var start = this.options.start != undefined ? this.options.start : range.min;
var end = this.options.end != undefined ? this.options.end : range.max;
this.setWindow(start, end, { animation: false });
} else {
this.fit({ animation: false });
}
}
this.body.emitter.emit('_change', { queue: true });
}; };
/** /**
@ -10935,6 +10941,7 @@ return /******/ (function(modules) { // webpackBootstrap
factor = interval / _this.props.center.width; factor = interval / _this.props.center.width;
util.forEach(_this.itemSet.items, (function (item) { util.forEach(_this.itemSet.items, (function (item) {
item.show(); item.show();
item.repositionX();
var start = getStart(item); var start = getStart(item);
var end = getEnd(item); var end = getEnd(item);
@ -14611,23 +14618,14 @@ return /******/ (function(modules) { // webpackBootstrap
*/ */
exports.onTouch = function (hammer, callback) { exports.onTouch = function (hammer, callback) {
callback.inputHandler = function (event) { callback.inputHandler = function (event) {
if (event.isFirst && !isTouching) {
if (event.isFirst) {
callback(event); callback(event);
isTouching = true;
setTimeout(function () {
isTouching = false;
}, 0);
} }
}; };
hammer.on('hammer.input', callback.inputHandler); hammer.on('hammer.input', callback.inputHandler);
}; };
// isTouching is true while a touch action is being emitted
// this is a hack to prevent `touch` from being fired twice
var isTouching = false;
/** /**
* Register a release event, taking place after a gesture * Register a release event, taking place after a gesture
* @param {Hammer} hammer A hammer instance * @param {Hammer} hammer A hammer instance
@ -14635,23 +14633,14 @@ return /******/ (function(modules) { // webpackBootstrap
*/ */
exports.onRelease = function (hammer, callback) { exports.onRelease = function (hammer, callback) {
callback.inputHandler = function (event) { callback.inputHandler = function (event) {
if (event.isFinal && !isReleasing) {
if (event.isFinal) {
callback(event); callback(event);
isReleasing = true;
setTimeout(function () {
isReleasing = false;
}, 0);
} }
}; };
return hammer.on('hammer.input', callback.inputHandler); return hammer.on('hammer.input', callback.inputHandler);
}; };
// isReleasing is true while a release action is being emitted
// this is a hack to prevent `release` from being fired twice
var isReleasing = false;
/** /**
* Unregister a touch event, taking place before a gesture * Unregister a touch event, taking place before a gesture
* @param {Hammer} hammer A hammer instance * @param {Hammer} hammer A hammer instance
@ -15299,13 +15288,15 @@ return /******/ (function(modules) { // webpackBootstrap
this.dom.rightContainer.appendChild(this.dom.shadowBottomRight); this.dom.rightContainer.appendChild(this.dom.shadowBottomRight);
this.on('rangechange', (function () { this.on('rangechange', (function () {
this._redraw(); // this allows overriding the _redraw method
if (this.initialDrawDone) {
this._redraw(); // this allows overriding the _redraw method
}
}).bind(this)); }).bind(this));
this.on('touch', this._onTouch.bind(this)); this.on('touch', this._onTouch.bind(this));
this.on('pan', this._onDrag.bind(this)); this.on('pan', this._onDrag.bind(this));
var me = this; var me = this;
this.on('change', function (properties) {
this.on('_change', function (properties) {
if (properties && properties.queue == true) { if (properties && properties.queue == true) {
// redraw once on next tick // redraw once on next tick
if (!me._redrawTimer) { if (!me._redrawTimer) {
@ -15385,6 +15376,7 @@ return /******/ (function(modules) { // webpackBootstrap
this.touch = {}; this.touch = {};
this.redrawCount = 0; this.redrawCount = 0;
this.initialDrawDone = false;
// attach the root panel to the provided container // attach the root panel to the provided container
if (!container) throw new Error('No container provided'); if (!container) throw new Error('No container provided');
@ -15515,11 +15507,11 @@ return /******/ (function(modules) { // webpackBootstrap
// override redraw with a throttled version // override redraw with a throttled version
if (!this._origRedraw) { if (!this._origRedraw) {
this._origRedraw = this._redraw.bind(this); this._origRedraw = this._redraw.bind(this);
this._redraw = util.throttle(this._origRedraw, this.options.throttleRedraw);
} else {
// Not the initial run: redraw everything
this._redraw();
} }
this._redraw = util.throttle(this._origRedraw, this.options.throttleRedraw);
// redraw everything
this._redraw();
}; };
/** /**
@ -15816,12 +15808,13 @@ return /******/ (function(modules) { // webpackBootstrap
* @protected * @protected
*/ */
Core.prototype._redraw = function () { Core.prototype._redraw = function () {
this.redrawCount++;
var resized = false; var resized = false;
var options = this.options; var options = this.options;
var props = this.props; var props = this.props;
var dom = this.dom; var dom = this.dom;
if (!dom) return; // when destroyed
if (!dom || !dom.container || dom.container.clientWidth == 0) return; // when destroyed, or invisible
DateUtil.updateHiddenDates(this.options.moment, this.body, this.options.hiddenDates); DateUtil.updateHiddenDates(this.options.moment, this.body, this.options.hiddenDates);
@ -15957,17 +15950,21 @@ return /******/ (function(modules) { // webpackBootstrap
this.components.forEach(function (component) { this.components.forEach(function (component) {
resized = component.redraw() || resized; resized = component.redraw() || resized;
}); });
var MAX_REDRAW = 5;
if (resized) { if (resized) {
// keep repainting until all sizes are settled
var MAX_REDRAWS = 3; // maximum number of consecutive redraws
if (this.redrawCount < MAX_REDRAWS) {
this.redrawCount++;
this._redraw();
if (this.redrawCount < MAX_REDRAW) {
this.body.emitter.emit('_change');
return;
} else { } else {
console.log('WARNING: infinite loop in redraw?'); console.log('WARNING: infinite loop in redraw?');
} }
} else {
this.redrawCount = 0; this.redrawCount = 0;
} }
this.initialDrawDone = true;
//Emit public 'changed' event for UI updates, see issue #1592
this.body.emitter.emit("changed");
}; };
// TODO: deprecated since version 1.1.0, remove some day // TODO: deprecated since version 1.1.0, remove some day
@ -16092,7 +16089,7 @@ return /******/ (function(modules) { // webpackBootstrap
me.props.lastWidth = me.dom.root.offsetWidth; me.props.lastWidth = me.dom.root.offsetWidth;
me.props.lastHeight = me.dom.root.offsetHeight; me.props.lastHeight = me.dom.root.offsetHeight;
me.emit('change');
me.body.emitter.emit('_change');
} }
} }
}; };
@ -16100,6 +16097,12 @@ return /******/ (function(modules) { // webpackBootstrap
// add event listener to window resize // add event listener to window resize
util.addEventListener(window, 'resize', this._onResize); util.addEventListener(window, 'resize', this._onResize);
//Prevent initial unnecessary redraw
if (me.dom.root) {
me.props.lastWidth = me.dom.root.offsetWidth;
me.props.lastHeight = me.dom.root.offsetHeight;
}
this.watchTimer = setInterval(this._onResize, 1000); this.watchTimer = setInterval(this._onResize, 1000);
}; };
@ -16997,7 +17000,7 @@ return /******/ (function(modules) { // webpackBootstrap
// update the order of all items in each group // update the order of all items in each group
this._order(); this._order();
this.body.emitter.emit('change', { queue: true });
this.body.emitter.emit('_change', { queue: true });
}; };
/** /**
@ -17102,7 +17105,7 @@ return /******/ (function(modules) { // webpackBootstrap
this._order(); this._order();
this.stackDirty = true; // force re-stacking of all items next redraw this.stackDirty = true; // force re-stacking of all items next redraw
this.body.emitter.emit('change', { queue: true });
this.body.emitter.emit('_change', { queue: true });
}; };
/** /**
@ -17132,7 +17135,7 @@ return /******/ (function(modules) { // webpackBootstrap
// update order // update order
this._order(); this._order();
this.stackDirty = true; // force re-stacking of all items next redraw this.stackDirty = true; // force re-stacking of all items next redraw
this.body.emitter.emit('change', { queue: true });
this.body.emitter.emit('_change', { queue: true });
} }
}; };
@ -17201,7 +17204,7 @@ return /******/ (function(modules) { // webpackBootstrap
} }
}); });
this.body.emitter.emit('change', { queue: true });
this.body.emitter.emit('_change', { queue: true });
}; };
/** /**
@ -17222,7 +17225,7 @@ return /******/ (function(modules) { // webpackBootstrap
this.markDirty(); this.markDirty();
this.body.emitter.emit('change', { queue: true });
this.body.emitter.emit('_change', { queue: true });
}; };
/** /**
@ -17585,7 +17588,7 @@ return /******/ (function(modules) { // webpackBootstrap
}).bind(this)); }).bind(this));
this.stackDirty = true; // force re-stacking of all items next redraw this.stackDirty = true; // force re-stacking of all items next redraw
this.body.emitter.emit('change');
this.body.emitter.emit('_change');
} }
}; };
@ -17636,7 +17639,7 @@ return /******/ (function(modules) { // webpackBootstrap
// force re-stacking of all items next redraw // force re-stacking of all items next redraw
me.stackDirty = true; me.stackDirty = true;
me.body.emitter.emit('change');
me.body.emitter.emit('_change');
}); });
} else { } else {
// update existing item // update existing item
@ -17651,7 +17654,7 @@ return /******/ (function(modules) { // webpackBootstrap
props.item.setData(props.data); props.item.setData(props.data);
me.stackDirty = true; // force re-stacking of all items next redraw me.stackDirty = true; // force re-stacking of all items next redraw
me.body.emitter.emit('change');
me.body.emitter.emit('_change');
} }
}); });
} }
@ -24269,6 +24272,7 @@ return /******/ (function(modules) { // webpackBootstrap
// item set // item set
this.linegraph = new LineGraph(this.body); this.linegraph = new LineGraph(this.body);
this.components.push(this.linegraph); this.components.push(this.linegraph);
this.itemsData = null; // DataSet this.itemsData = null; // DataSet
@ -24297,9 +24301,8 @@ return /******/ (function(modules) { // webpackBootstrap
// create itemset // create itemset
if (items) { if (items) {
this.setItems(items); this.setItems(items);
} else {
this._redraw();
} }
this._redraw();
} }
// Extend the functionality from Core // Extend the functionality from Core
@ -24346,7 +24349,6 @@ return /******/ (function(modules) { // webpackBootstrap
if (this.options.start != undefined || this.options.end != undefined) { if (this.options.start != undefined || this.options.end != undefined) {
var start = this.options.start != undefined ? this.options.start : null; var start = this.options.start != undefined ? this.options.start : null;
var end = this.options.end != undefined ? this.options.end : null; var end = this.options.end != undefined ? this.options.end : null;
this.setWindow(start, end, { animation: false }); this.setWindow(start, end, { animation: false });
} else { } else {
this.fit({ animation: false }); this.fit({ animation: false });
@ -24581,6 +24583,7 @@ return /******/ (function(modules) { // webpackBootstrap
this.abortedGraphUpdate = false; this.abortedGraphUpdate = false;
this.updateSVGheight = false; this.updateSVGheight = false;
this.updateSVGheightOnResize = false; this.updateSVGheightOnResize = false;
this.forceGraphUpdate = true;
var me = this; var me = this;
this.itemsData = null; // DataSet this.itemsData = null; // DataSet
@ -24620,17 +24623,18 @@ return /******/ (function(modules) { // webpackBootstrap
this.svgElements = {}; this.svgElements = {};
this.setOptions(options); this.setOptions(options);
this.groupsUsingDefaultStyles = [0]; this.groupsUsingDefaultStyles = [0];
this.COUNTER = 0;
this.body.emitter.on('rangechanged', function () { this.body.emitter.on('rangechanged', function () {
me.lastStart = me.body.range.start; me.lastStart = me.body.range.start;
me.svg.style.left = util.option.asSize(-me.props.width); me.svg.style.left = util.option.asSize(-me.props.width);
me.redraw.call(me, true);
me.forceGraphUpdate = true;
//Is this local redraw necessary? (Core also does a change event!)
me.redraw.call(me);
}); });
// create the HTML DOM // create the HTML DOM
this._create(); this._create();
this.framework = { svg: this.svg, svgElements: this.svgElements, options: this.options, groups: this.groups }; this.framework = { svg: this.svg, svgElements: this.svgElements, options: this.options, groups: this.groups };
this.body.emitter.emit('change');
} }
LineGraph.prototype = new Component(); LineGraph.prototype = new Component();
@ -24672,7 +24676,7 @@ return /******/ (function(modules) { // webpackBootstrap
LineGraph.prototype.setOptions = function (options) { LineGraph.prototype.setOptions = function (options) {
if (options) { if (options) {
var fields = ['sampling', 'defaultGroup', 'stack', 'height', 'graphHeight', 'yAxisOrientation', 'style', 'barChart', 'dataAxis', 'sort', 'groups']; var fields = ['sampling', 'defaultGroup', 'stack', 'height', 'graphHeight', 'yAxisOrientation', 'style', 'barChart', 'dataAxis', 'sort', 'groups'];
if (options.graphHeight === undefined && options.height !== undefined && this.body.domProps.centerContainer.height !== undefined) {
if (options.graphHeight === undefined && options.height !== undefined) {
this.updateSVGheight = true; this.updateSVGheight = true;
this.updateSVGheightOnResize = true; this.updateSVGheightOnResize = true;
} else if (this.body.domProps.centerContainer.height !== undefined && options.graphHeight !== undefined) { } else if (this.body.domProps.centerContainer.height !== undefined && options.graphHeight !== undefined) {
@ -24722,7 +24726,9 @@ return /******/ (function(modules) { // webpackBootstrap
// this is used to redraw the graph if the visibility of the groups is changed. // this is used to redraw the graph if the visibility of the groups is changed.
if (this.dom.frame) { if (this.dom.frame) {
this.redraw(true);
//not on initial run?
this.forceGraphUpdate = true;
this.body.emitter.emit("_change", { queue: true });
} }
}; };
@ -24835,7 +24841,6 @@ return /******/ (function(modules) { // webpackBootstrap
LineGraph.prototype._onUpdate = function (ids) { LineGraph.prototype._onUpdate = function (ids) {
this._updateAllGroupData(); this._updateAllGroupData();
this.redraw(true);
}; };
LineGraph.prototype._onAdd = function (ids) { LineGraph.prototype._onAdd = function (ids) {
this._onUpdate(ids); this._onUpdate(ids);
@ -24845,7 +24850,6 @@ return /******/ (function(modules) { // webpackBootstrap
}; };
LineGraph.prototype._onUpdateGroups = function (groupIds) { LineGraph.prototype._onUpdateGroups = function (groupIds) {
this._updateAllGroupData(); this._updateAllGroupData();
this.redraw(true);
}; };
LineGraph.prototype._onAddGroups = function (groupIds) { LineGraph.prototype._onAddGroups = function (groupIds) {
this._onUpdateGroups(groupIds); this._onUpdateGroups(groupIds);
@ -24860,7 +24864,8 @@ return /******/ (function(modules) { // webpackBootstrap
for (var i = 0; i < groupIds.length; i++) { for (var i = 0; i < groupIds.length; i++) {
this._removeGroup(groupIds[i]); this._removeGroup(groupIds[i]);
} }
this.redraw(true);
this.forceGraphUpdate = true;
this.body.emitter.emit("_change", { queue: true });
}; };
/** /**
@ -24905,9 +24910,15 @@ return /******/ (function(modules) { // webpackBootstrap
if (this.groups[groupId].options.yAxisOrientation == 'right') { if (this.groups[groupId].options.yAxisOrientation == 'right') {
this.yAxisRight.updateGroup(groupId, this.groups[groupId]); this.yAxisRight.updateGroup(groupId, this.groups[groupId]);
this.legendRight.updateGroup(groupId, this.groups[groupId]); this.legendRight.updateGroup(groupId, this.groups[groupId]);
//If yAxisOrientation changed, clean out the group from the other axis.
this.yAxisLeft.removeGroup(groupId);
this.legendLeft.removeGroup(groupId);
} else { } else {
this.yAxisLeft.updateGroup(groupId, this.groups[groupId]); this.yAxisLeft.updateGroup(groupId, this.groups[groupId]);
this.legendLeft.updateGroup(groupId, this.groups[groupId]); this.legendLeft.updateGroup(groupId, this.groups[groupId]);
//If yAxisOrientation changed, clean out the group from the other axis.
this.yAxisRight.removeGroup(groupId);
this.legendRight.removeGroup(groupId);
} }
} }
this.legendLeft.redraw(); this.legendLeft.redraw();
@ -24983,6 +24994,8 @@ return /******/ (function(modules) { // webpackBootstrap
} }
} }
} }
this.forceGraphUpdate = true;
this.body.emitter.emit("_change", { queue: true });
} }
}; };
@ -24990,16 +25003,16 @@ return /******/ (function(modules) { // webpackBootstrap
* Redraw the component, mandatory function * Redraw the component, mandatory function
* @return {boolean} Returns true if the component is resized * @return {boolean} Returns true if the component is resized
*/ */
LineGraph.prototype.redraw = function (forceGraphUpdate) {
LineGraph.prototype.redraw = function () {
var resized = false; var resized = false;
// calculate actual size and position // calculate actual size and position
this.props.width = this.dom.frame.offsetWidth; this.props.width = this.dom.frame.offsetWidth;
this.props.height = this.body.domProps.centerContainer.height - this.body.domProps.border.top - this.body.domProps.border.bottom; this.props.height = this.body.domProps.centerContainer.height - this.body.domProps.border.top - this.body.domProps.border.bottom;
// update the graph if there is no lastWidth or with, used for the initial draw
// update the graph if there is no lastWidth or width, used for the initial draw
if (this.lastWidth === undefined && this.props.width) { if (this.lastWidth === undefined && this.props.width) {
forceGraphUpdate = true;
this.forceGraphUpdate = true;
} }
// check if this component is resized // check if this component is resized
@ -25034,8 +25047,9 @@ return /******/ (function(modules) { // webpackBootstrap
} }
// zoomed is here to ensure that animations are shown correctly. // zoomed is here to ensure that animations are shown correctly.
if (resized == true || zoomed == true || this.abortedGraphUpdate == true || forceGraphUpdate == true) {
if (resized == true || zoomed == true || this.abortedGraphUpdate == true || this.forceGraphUpdate == true) {
resized = this._updateGraph() || resized; resized = this._updateGraph() || resized;
this.forceGraphUpdate = false;
} else { } else {
// move the whole svg while dragging // move the whole svg while dragging
if (this.lastStart != 0) { if (this.lastStart != 0) {
@ -25048,7 +25062,6 @@ return /******/ (function(modules) { // webpackBootstrap
} }
} }
} }
this.legendLeft.redraw(); this.legendLeft.redraw();
this.legendRight.redraw(); this.legendRight.redraw();
return resized; return resized;
@ -25114,96 +25127,93 @@ return /******/ (function(modules) { // webpackBootstrap
this._getYRanges(groupIds, groupsData, groupRanges); this._getYRanges(groupIds, groupsData, groupRanges);
// update the Y axis first, we use this data to draw at the correct Y points // update the Y axis first, we use this data to draw at the correct Y points
// changeCalled is required to clean the SVG on a change emit.
changeCalled = this._updateYAxis(groupIds, groupRanges); changeCalled = this._updateYAxis(groupIds, groupRanges);
var MAX_CYCLES = 5;
if (changeCalled == true && this.COUNTER < MAX_CYCLES) {
// at changeCalled, abort this update cycle as the graph needs another update with new Width input from the Redraw container.
// Cleanup SVG elements on abort.
if (changeCalled == true) {
DOMutil.cleanupElements(this.svgElements); DOMutil.cleanupElements(this.svgElements);
this.abortedGraphUpdate = true; this.abortedGraphUpdate = true;
this.COUNTER++;
this.body.emitter.emit('change');
return true; return true;
} else {
if (this.COUNTER > MAX_CYCLES) {
console.log("WARNING: there may be an infinite loop in the _updateGraph emitter cycle.");
}
this.COUNTER = 0;
this.abortedGraphUpdate = false;
// With the yAxis scaled correctly, use this to get the Y values of the points.
var below = undefined;
for (i = 0; i < groupIds.length; i++) {
group = this.groups[groupIds[i]];
if (this.options.stack === true && this.options.style === 'line') {
if (group.options.excludeFromStacking == undefined || !group.options.excludeFromStacking) {
if (below != undefined) {
this._stack(groupsData[group.id], groupsData[below.id]);
if (group.options.shaded.enabled == true && group.options.shaded.orientation !== "group") {
if (group.options.shaded.orientation == "top" && below.options.shaded.orientation !== "group") {
below.options.shaded.orientation = "group";
below.options.shaded.groupId = group.id;
} else {
group.options.shaded.orientation = "group";
group.options.shaded.groupId = below.id;
}
}
this.abortedGraphUpdate = false;
// With the yAxis scaled correctly, use this to get the Y values of the points.
var below = undefined;
for (i = 0; i < groupIds.length; i++) {
group = this.groups[groupIds[i]];
if (this.options.stack === true && this.options.style === 'line') {
if (group.options.excludeFromStacking == undefined || !group.options.excludeFromStacking) {
if (below != undefined) {
this._stack(groupsData[group.id], groupsData[below.id]);
if (group.options.shaded.enabled == true && group.options.shaded.orientation !== "group") {
if (group.options.shaded.orientation == "top" && below.options.shaded.orientation !== "group") {
below.options.shaded.orientation = "group";
below.options.shaded.groupId = group.id;
} else {
group.options.shaded.orientation = "group";
group.options.shaded.groupId = below.id;
} }
} }
below = group;
} }
below = group;
} }
this._convertYcoordinates(groupsData[groupIds[i]], group);
} }
this._convertYcoordinates(groupsData[groupIds[i]], group);
}
//Precalculate paths and draw shading if appropriate. This will make sure the shading is always behind any lines.
var paths = {};
for (i = 0; i < groupIds.length; i++) {
group = this.groups[groupIds[i]];
if (group.options.style === 'line' && group.options.shaded.enabled == true) {
var dataset = groupsData[groupIds[i]];
if (!paths.hasOwnProperty(groupIds[i])) {
paths[groupIds[i]] = Lines.calcPath(dataset, group);
//Precalculate paths and draw shading if appropriate. This will make sure the shading is always behind any lines.
var paths = {};
for (i = 0; i < groupIds.length; i++) {
group = this.groups[groupIds[i]];
if (group.options.style === 'line' && group.options.shaded.enabled == true) {
var dataset = groupsData[groupIds[i]];
if (dataset == null || dataset.length == 0) {
continue;
}
if (!paths.hasOwnProperty(groupIds[i])) {
paths[groupIds[i]] = Lines.calcPath(dataset, group);
}
if (group.options.shaded.orientation === "group") {
var subGroupId = group.options.shaded.groupId;
if (groupIds.indexOf(subGroupId) === -1) {
console.log(group.id + ": Unknown shading group target given:" + subGroupId);
continue;
} }
if (group.options.shaded.orientation === "group") {
var subGroupId = group.options.shaded.groupId;
if (groupIds.indexOf(subGroupId) === -1) {
console.log(group.id + ": Unknown shading group target given:" + subGroupId);
continue;
}
if (!paths.hasOwnProperty(subGroupId)) {
paths[subGroupId] = Lines.calcPath(groupsData[subGroupId], this.groups[subGroupId]);
}
Lines.drawShading(paths[groupIds[i]], group, paths[subGroupId], this.framework);
} else {
Lines.drawShading(paths[groupIds[i]], group, undefined, this.framework);
if (!paths.hasOwnProperty(subGroupId)) {
paths[subGroupId] = Lines.calcPath(groupsData[subGroupId], this.groups[subGroupId]);
} }
Lines.drawShading(paths[groupIds[i]], group, paths[subGroupId], this.framework);
} else {
Lines.drawShading(paths[groupIds[i]], group, undefined, this.framework);
} }
} }
}
// draw the groups, calculating paths if still necessary.
Bars.draw(groupIds, groupsData, this.framework);
for (i = 0; i < groupIds.length; i++) {
group = this.groups[groupIds[i]];
if (groupsData[groupIds[i]].length > 0) {
switch (group.options.style) {
case "line":
if (!paths.hasOwnProperty(groupIds[i])) {
paths[groupIds[i]] = Lines.calcPath(groupsData[groupIds[i]], group);
}
Lines.draw(paths[groupIds[i]], group, this.framework);
//explicit no break;
case "point":
//explicit no break;
case "points":
if (group.options.style == "point" || group.options.style == "points" || group.options.drawPoints.enabled == true) {
Points.draw(groupsData[groupIds[i]], group, this.framework);
}
break;
case "bar":
// bar needs to be drawn enmasse
//explicit no break
default:
//do nothing...
}
// draw the groups, calculating paths if still necessary.
Bars.draw(groupIds, groupsData, this.framework);
for (i = 0; i < groupIds.length; i++) {
group = this.groups[groupIds[i]];
if (groupsData[groupIds[i]].length > 0) {
switch (group.options.style) {
case "line":
if (!paths.hasOwnProperty(groupIds[i])) {
paths[groupIds[i]] = Lines.calcPath(groupsData[groupIds[i]], group);
}
Lines.draw(paths[groupIds[i]], group, this.framework);
//explicit no break;
case "point":
//explicit no break;
case "points":
if (group.options.style == "point" || group.options.style == "points" || group.options.drawPoints.enabled == true) {
Points.draw(groupsData[groupIds[i]], group, this.framework);
}
break;
case "bar":
// bar needs to be drawn enmasse
//explicit no break
default:
//do nothing...
} }
} }
} }
@ -25572,14 +25582,14 @@ return /******/ (function(modules) { // webpackBootstrap
left: { left: {
range: { min: undefined, max: undefined }, range: { min: undefined, max: undefined },
format: function format(value) { format: function format(value) {
return '' + value.toPrecision(3);
return '' + Number.parseFloat(value.toPrecision(3));
}, },
title: { text: undefined, style: undefined } title: { text: undefined, style: undefined }
}, },
right: { right: {
range: { min: undefined, max: undefined }, range: { min: undefined, max: undefined },
format: function format(value) { format: function format(value) {
return '' + value.toPrecision(3);
return '' + Number.parseFloat(value.toPrecision(3));
}, },
title: { text: undefined, style: undefined } title: { text: undefined, style: undefined }
} }
@ -25639,6 +25649,9 @@ return /******/ (function(modules) { // webpackBootstrap
}; };
DataAxis.prototype.updateGroup = function (label, graphOptions) { DataAxis.prototype.updateGroup = function (label, graphOptions) {
if (!this.groups.hasOwnProperty(label)) {
this.amountOfGroups += 1;
}
this.groups[label] = graphOptions; this.groups[label] = graphOptions;
}; };
@ -25873,9 +25886,8 @@ return /******/ (function(modules) { // webpackBootstrap
var orientation = this.options['orientation']; var orientation = this.options['orientation'];
// get the range for the slaved axis // get the range for the slaved axis
var step;
var step, stepSize, rangeStart, rangeEnd;
if (this.master === false) { if (this.master === false) {
var stepSize, rangeStart, rangeEnd, minimumStep;
if (this.zeroCrossing !== -1 && this.options.alignZeros === true) { if (this.zeroCrossing !== -1 && this.options.alignZeros === true) {
if (this.range.end > 0) { if (this.range.end > 0) {
stepSize = this.range.end / this.zeroCrossing; // size of one step stepSize = this.range.end / this.zeroCrossing; // size of one step
@ -25891,13 +25903,12 @@ return /******/ (function(modules) { // webpackBootstrap
rangeStart = this.range.start; rangeStart = this.range.start;
rangeEnd = this.range.end; rangeEnd = this.range.end;
} }
minimumStep = this.stepPixels;
} else { } else {
// calculate range and step (step such that we have space for 7 characters per label) // calculate range and step (step such that we have space for 7 characters per label)
minimumStep = this.props.majorCharHeight;
rangeStart = this.range.start; rangeStart = this.range.start;
rangeEnd = this.range.end; rangeEnd = this.range.end;
} }
var minimumStep = this.props.majorCharHeight;
this.step = step = new DataStep(rangeStart, rangeEnd, minimumStep, this.dom.frame.offsetHeight, this.options[this.options.orientation].range, this.options[this.options.orientation].format, this.master === false && this.options.alignZeros // does the step have to align zeros? only if not master and the options is on this.step = step = new DataStep(rangeStart, rangeEnd, minimumStep, this.dom.frame.offsetHeight, this.options[this.options.orientation].range, this.options[this.options.orientation].format, this.master === false && this.options.alignZeros // does the step have to align zeros? only if not master and the options is on
); );
@ -26172,9 +26183,7 @@ return /******/ (function(modules) { // webpackBootstrap
function DataStep(start, end, minimumStep, containerHeight, customRange, formattingFunction, alignZeros) { function DataStep(start, end, minimumStep, containerHeight, customRange, formattingFunction, alignZeros) {
// variables // variables
this.current = 0;
this.autoScale = true;
this.current = -1;
this.stepIndex = 0; this.stepIndex = 0;
this.step = 1; this.step = 1;
this.scale = 1; this.scale = 1;
@ -26182,7 +26191,6 @@ return /******/ (function(modules) { // webpackBootstrap
this.marginStart; this.marginStart;
this.marginEnd; this.marginEnd;
this.deadSpace = 0;
this.majorSteps = [1, 2, 5, 10]; this.majorSteps = [1, 2, 5, 10];
this.minorSteps = [0.25, 0.5, 1, 2]; this.minorSteps = [0.25, 0.5, 1, 2];
@ -26203,17 +26211,17 @@ return /******/ (function(modules) { // webpackBootstrap
* @param {Number} [minimumStep] Optional. Minimum step size in milliseconds * @param {Number} [minimumStep] Optional. Minimum step size in milliseconds
*/ */
DataStep.prototype.setRange = function (start, end, minimumStep, containerHeight, customRange) { DataStep.prototype.setRange = function (start, end, minimumStep, containerHeight, customRange) {
if (customRange === undefined) {
customRange = {};
}
this._start = customRange.min === undefined ? start : customRange.min; this._start = customRange.min === undefined ? start : customRange.min;
this._end = customRange.max === undefined ? end : customRange.max; this._end = customRange.max === undefined ? end : customRange.max;
if (this._start === this._end) { if (this._start === this._end) {
this._start = customRange.min === undefined ? this._start - 0.75 : this._start; this._start = customRange.min === undefined ? this._start - 0.75 : this._start;
this._end = customRange.max === undefined ? this._end + 1 : this._end;;
this._end = customRange.max === undefined ? this._end + 1 : this._end;
} }
if (this.autoScale === true) {
this.setMinimumStep(minimumStep, containerHeight);
}
this.setMinimumStep(minimumStep, containerHeight);
this.setFirst(customRange); this.setFirst(customRange);
}; };
@ -26276,9 +26284,7 @@ return /******/ (function(modules) { // webpackBootstrap
this.marginEnd += this.marginEnd % this.step; this.marginEnd += this.marginEnd % this.step;
} }
this.deadSpace = this.roundToMinor(niceEnd) - niceEnd + this.roundToMinor(niceStart) - niceStart;
this.marginRange = this.marginEnd - this.marginStart; this.marginRange = this.marginEnd - this.marginStart;
this.current = this.marginEnd; this.current = this.marginEnd;
}; };
@ -26328,6 +26334,7 @@ return /******/ (function(modules) { // webpackBootstrap
DataStep.prototype.getCurrent = function () { DataStep.prototype.getCurrent = function () {
// prevent round-off errors when close to zero // prevent round-off errors when close to zero
var current = Math.abs(this.current) < this.step / 2 ? 0 : this.current; var current = Math.abs(this.current) < this.step / 2 ? 0 : this.current;
var returnValue = current; var returnValue = current;
if (typeof this.formattingFunction === 'function') { if (typeof this.formattingFunction === 'function') {
return this.formattingFunction(current); return this.formattingFunction(current);
@ -26382,7 +26389,7 @@ return /******/ (function(modules) { // webpackBootstrap
*/ */
function GraphGroup(group, groupId, options, groupsUsingDefaultStyles) { function GraphGroup(group, groupId, options, groupsUsingDefaultStyles) {
this.id = groupId; this.id = groupId;
var fields = ['sampling', 'style', 'sort', 'yAxisOrientation', 'barChart', 'drawPoints', 'shaded', 'interpolation', 'zIndex'];
var fields = ['sampling', 'style', 'sort', 'yAxisOrientation', 'barChart', 'drawPoints', 'shaded', 'interpolation', 'zIndex', 'excludeFromStacking', 'excludeFromLegend'];
this.options = util.selectiveBridgeObject(fields, options); this.options = util.selectiveBridgeObject(fields, options);
this.usingDefaultStyle = group.className === undefined; this.usingDefaultStyle = group.className === undefined;
this.groupsUsingDefaultStyles = groupsUsingDefaultStyles; this.groupsUsingDefaultStyles = groupsUsingDefaultStyles;
@ -26430,7 +26437,7 @@ return /******/ (function(modules) { // webpackBootstrap
*/ */
GraphGroup.prototype.setOptions = function (options) { GraphGroup.prototype.setOptions = function (options) {
if (options !== undefined) { if (options !== undefined) {
var fields = ['sampling', 'style', 'sort', 'yAxisOrientation', 'barChart', 'excludeFromLegend', 'excludeFromStacking', 'zIndex'];
var fields = ['sampling', 'style', 'sort', 'yAxisOrientation', 'barChart', 'zIndex', 'excludeFromStacking', 'excludeFromLegend'];
util.selectiveDeepExtend(fields, this.options, options); util.selectiveDeepExtend(fields, this.options, options);
// if the group's drawPoints is a function delegate the callback to the onRender property // if the group's drawPoints is a function delegate the callback to the onRender property
@ -26636,7 +26643,7 @@ return /******/ (function(modules) { // webpackBootstrap
drawData = Bargraph._getSafeDrawData(coreDistance, group, minWidth); drawData = Bargraph._getSafeDrawData(coreDistance, group, minWidth);
intersections[key].resolved += 1; intersections[key].resolved += 1;
if (group.options.stack === true) {
if (group.options.stack === true && group.options.excludeFromStacking !== true) {
if (combinedData[i].screen_y < group.zeroPosition) { if (combinedData[i].screen_y < group.zeroPosition) {
heightOffset = intersections[key].accumulatedNegative; heightOffset = intersections[key].accumulatedNegative;
intersections[key].accumulatedNegative += group.zeroPosition - combinedData[i].screen_y; intersections[key].accumulatedNegative += group.zeroPosition - combinedData[i].screen_y;
@ -42132,7 +42139,7 @@ return /******/ (function(modules) { // webpackBootstrap
this.canvas.frame.removeChild(this.editModeDiv); this.canvas.frame.removeChild(this.editModeDiv);
} }
if (this.closeDiv) { if (this.closeDiv) {
this.canvas.frame.removeChild(this.manipulationDiv);
this.canvas.frame.removeChild(this.closeDiv);
} }
// set the references to undefined // set the references to undefined

+ 1
- 1
lib/network/modules/ManipulationSystem.js View File

@ -642,7 +642,7 @@ class ManipulationSystem {
// remove the manipulation divs // remove the manipulation divs
if (this.manipulationDiv) {this.canvas.frame.removeChild(this.manipulationDiv);} if (this.manipulationDiv) {this.canvas.frame.removeChild(this.manipulationDiv);}
if (this.editModeDiv) {this.canvas.frame.removeChild(this.editModeDiv);} if (this.editModeDiv) {this.canvas.frame.removeChild(this.editModeDiv);}
if (this.closeDiv) {this.canvas.frame.removeChild(this.manipulationDiv);}
if (this.closeDiv) {this.canvas.frame.removeChild(this.closeDiv);}
// set the references to undefined // set the references to undefined
this.manipulationDiv = undefined; this.manipulationDiv = undefined;

Loading…
Cancel
Save