Browse Source

Merge branch 'develop'

v3_develop v1.0.1
jos 10 years ago
parent
commit
382b231dff
20 changed files with 195 additions and 48 deletions
  1. +15
    -0
      HISTORY.md
  2. +1
    -1
      bower.json
  3. +64
    -17
      dist/vis.js
  4. +11
    -11
      dist/vis.min.js
  5. +29
    -1
      docs/graph.html
  6. +1
    -0
      examples/timeline/08_edit_items.html
  7. +1
    -0
      examples/timeline/09_order_groups.html
  8. +1
    -0
      examples/timeline/10_limit_move_and_zoom.html
  9. +3
    -1
      examples/timeline/11_points.html
  10. +5
    -1
      examples/timeline/12_custom_styling.html
  11. +1
    -0
      examples/timeline/15_item_class_names.html
  12. +1
    -1
      package.json
  13. +42
    -0
      src/graph/Graph.js
  14. +2
    -2
      src/graph/Groups.js
  15. +2
    -2
      src/graph/Images.js
  16. +6
    -4
      src/graph/graphMixins/physics/PhysicsMixin.js
  17. +2
    -2
      src/timeline/TimeStep.js
  18. +3
    -1
      src/timeline/component/ItemSet.js
  19. +4
    -3
      src/timeline/component/item/ItemRangeOverflow.js
  20. +1
    -1
      src/util.js

+ 15
- 0
HISTORY.md View File

@ -2,6 +2,21 @@
http://visjs.org
## 2014-05-09, version 1.0.1
### Timeline
- Fixed width of items with type `rangeoverflow`.
- Fixed a bug wrongly rendering invisible items after updating them.
### Graph
- Added coordinate conversion from DOM to Canvas.
- fixed bug where the graph stopped animation after settling in playing with physics.
- fixed bug where hierarchical physics properties were not handled.
- added events for change of view and zooming.
## 2014-05-02, version 1.0.0
### Timeline

+ 1
- 1
bower.json View File

@ -1,6 +1,6 @@
{
"name": "vis",
"version": "1.0.0",
"version": "1.0.1",
"description": "A dynamic, browser-based visualization library.",
"homepage": "http://visjs.org/",
"repository": {

+ 64
- 17
dist/vis.js View File

@ -4,8 +4,8 @@
*
* A dynamic, browser-based visualization library.
*
* @version 1.0.0
* @date 2014-05-02
* @version 1.0.1
* @date 2014-05-09
*
* @license
* Copyright (C) 2011-2014 Almende B.V, http://almende.com
@ -417,7 +417,7 @@ util.extend = function (a, b) {
util.equalArray = function (a, b) {
if (a.length != b.length) return false;
for (var i = 1, len = a.length; i < len; i++) {
for (var i = 0, len = a.length; i < len; i++) {
if (a[i] != b[i]) return false;
}
@ -2595,7 +2595,7 @@ stack.collision = function collision (a, b, margin) {
* @param {Date} [end] The end date
* @param {Number} [minimumStep] Optional. Minimum step size in milliseconds
*/
TimeStep = function(start, end, minimumStep) {
function TimeStep(start, end, minimumStep) {
// variables
this.current = new Date();
this._start = new Date();
@ -2607,7 +2607,7 @@ TimeStep = function(start, end, minimumStep) {
// initialize the range
this.setRange(start, end, minimumStep);
};
}
/// enum scale
TimeStep.SCALE = {
@ -5484,7 +5484,9 @@ ItemSet.prototype._updateItem = function _updateItem(item, itemData) {
var oldGroupId = item.data.group;
item.data = itemData;
item.repaint();
if (item.displayed) {
item.repaint();
}
// update group
if (oldGroupId != item.data.group) {
@ -6677,9 +6679,10 @@ ItemRangeOverflow.prototype.repositionX = function repositionX() {
this.left = start;
var boxWidth = Math.max(end - start, 1);
this.width = (this.props.content.width < boxWidth) ?
boxWidth :
start + contentLeft + this.props.content.width;
this.width = boxWidth + this.props.content.width;
// Note: The calculation of width is an optimistic calculation, giving
// a width which will not change when moving the Timeline
// So no restacking needed, which is nicer for the eye
this.dom.box.style.left = this.left + 'px';
this.dom.box.style.width = boxWidth + 'px';
@ -10779,10 +10782,10 @@ Popup.prototype.hide = function () {
* @class Groups
* This class can store groups and properties specific for groups.
*/
Groups = function () {
function Groups() {
this.clear();
this.defaultIndex = 0;
};
}
/**
@ -10860,11 +10863,11 @@ Groups.prototype.add = function (groupname, style) {
* @class Images
* This class loads images and keeps them stored.
*/
Images = function () {
function Images() {
this.images = {};
this.callback = undefined;
};
}
/**
* Set an onload callback function. This will be called each time an image
@ -11541,10 +11544,12 @@ function switchConfigurations () {
this.constants.physics.barnesHut.enabled = false;
}
else if (radioButton == "H") {
this.constants.hierarchicalLayout.enabled = true;
this.constants.physics.hierarchicalRepulsion.enabled = true;
this.constants.physics.barnesHut.enabled = false;
this._setupHierarchicalLayout();
if (this.constants.hierarchicalLayout.enabled == false) {
this.constants.hierarchicalLayout.enabled = true;
this.constants.physics.hierarchicalRepulsion.enabled = true;
this.constants.physics.barnesHut.enabled = false;
this._setupHierarchicalLayout();
}
}
else {
this.constants.hierarchicalLayout.enabled = false;
@ -16096,6 +16101,17 @@ Graph.prototype.setOptions = function (options) {
}
}
}
if (options.physics.hierarchicalRepulsion) {
this.constants.hierarchicalLayout.enabled = true;
this.constants.physics.hierarchicalRepulsion.enabled = true;
this.constants.physics.barnesHut.enabled = false;
for (prop in options.physics.hierarchicalRepulsion) {
if (options.physics.hierarchicalRepulsion.hasOwnProperty(prop)) {
this.constants.physics.hierarchicalRepulsion[prop] = options.physics.hierarchicalRepulsion[prop];
}
}
}
}
if (options.hierarchicalLayout) {
@ -16499,6 +16515,7 @@ Graph.prototype._handleOnDrag = function(event) {
this.drag.translation.y + diffY);
this._redraw();
this.moving = true;
this.start();
}
};
@ -16608,6 +16625,13 @@ Graph.prototype._zoom = function(scale, pointer) {
this.updateClustersDefault();
this._redraw();
if (scaleOld < scale) {
this.emit("zoom", {direction:"+"});
}
else {
this.emit("zoom", {direction:"-"});
}
return scale;
};
@ -17201,6 +17225,8 @@ Graph.prototype._setTranslation = function(offsetX, offsetY) {
if (offsetY !== undefined) {
this.translation.y = offsetY;
}
this.emit('viewChanged');
};
/**
@ -17273,6 +17299,27 @@ Graph.prototype._yToCanvas = function(y) {
return y * this.scale + this.translation.y ;
};
/**
*
* @param {object} pos = {x: number, y: number}
* @returns {{x: number, y: number}}
* @constructor
*/
Graph.prototype.DOMtoCanvas = function(pos) {
return {x:this._xToCanvas(pos.x),y:this._yToCanvas(pos.y)};
}
/**
*
* @param {object} pos = {x: number, y: number}
* @returns {{x: number, y: number}}
* @constructor
*/
Graph.prototype.canvasToDOM = function(pos) {
return {x:this._canvasToX(pos.x),y:this._canvasToY(pos.y)};
}
/**
* Redraw all nodes
* The 2d context of a HTML canvas can be retrieved by canvas.getContext('2d');

+ 11
- 11
dist/vis.min.js
File diff suppressed because it is too large
View File


+ 29
- 1
docs/graph.html View File

@ -1999,7 +1999,18 @@ var options: {
You can use this to stablize your graph once, then save the positions in a database so the next time you load the nodes, stabilization will be near instantaneous.
</td>
</tr>
<tr>
<td>DOMtoCanvas(pos)</td>
<td>object</td>
<td>This function converts DOM coordinates to coordinates on the canvas. Input and output are in the form of {x:xpos,y:ypos}. The DOM values are relative to the graph container.
</td>
</tr>
<tr>
<td>canvasToDOM(pos)</td>
<td>object</td>
<td>This function converts canvas coordinates to coordinates on the DOM. Input and output are in the form of {x:xpos,y:ypos}. The DOM values are relative to the graph container.
</td>
</tr>
<tr>
<td>on(event, callback)</td>
<td>none</td>
@ -2161,6 +2172,23 @@ graph.off('select', onSelect);
</ul>
</td>
</tr>
<tr>
<td>viewChanged</td>
<td>Fired when the view has changed. This is when the graph has moved or zoomed.</td>
<td>
none
</td>
</tr>
<tr>
<td>zoom</td>
<td>Fired when the graph has zoomed. This event can be used to trigger the .storePosition() function after stabilization.</td>
<td>
<ul>
<li><code>direction: </code> "+" or "-" </li>
</ul>
</td>
</tr>
</table>

+ 1
- 0
examples/timeline/08_edit_items.html View File

@ -18,6 +18,7 @@
<div id="log"></div>
<script type="text/javascript">
// note that months are zero-based in the JavaScript Date object, so month 3 is April
var items = new vis.DataSet([
{id: 1, content: 'item 1', start: new Date(2013, 3, 20)},
{id: 2, content: 'item 2', start: new Date(2013, 3, 14)},

+ 1
- 0
examples/timeline/09_order_groups.html View File

@ -33,6 +33,7 @@
]);
// create a dataset with items
// note that months are zero-based in the JavaScript Date object, so month 3 is April
var items = new vis.DataSet([
{id: 0, group: 0, content: 'item 0', start: new Date(2014, 3, 17), end: new Date(2014, 3, 21)},
{id: 1, group: 0, content: 'item 1', start: new Date(2014, 3, 19), end: new Date(2014, 3, 20)},

+ 1
- 0
examples/timeline/10_limit_move_and_zoom.html View File

@ -27,6 +27,7 @@
<script>
// create some items
// note that months are zero-based in the JavaScript Date object, so month 4 is May
var items = [
{'start': new Date(2012, 4, 25), 'content': 'First'},
{'start': new Date(2012, 4, 26), 'content': 'Last'}

+ 3
- 1
examples/timeline/11_points.html View File

@ -22,6 +22,7 @@
<script type="text/javascript">
var container = document.getElementById('visualization');
// note that months are zero-based in the JavaScript Date object
var items = [
{start: new Date(1939,8,1), content: 'German Invasion of Poland'},
{start: new Date(1940,4,10), content: 'Battle of France and the Low Countries'},
@ -48,7 +49,8 @@
var options = {
// Set global item type. Type can also be specified for items individually
// Available types: 'box' (default), 'point', 'range', 'rangeoverflow'
type: 'point'
type: 'point',
showMajorLabels: false
};
var timeline = new vis.Timeline(container, items, options);

+ 5
- 1
examples/timeline/12_custom_styling.html View File

@ -65,8 +65,10 @@
<script type="text/javascript">
var container = document.getElementById('visualization');
// note that months are zero-based in the JavaScript Date object
var items = [
{start: new Date(2010,7,23), content: '<div>Conversation</div><img src="img/community-users-icon.png" style="width:32px; height:32px;">', type: 'point'},
{start: new Date(2010,7,23), content: '<div>Conversation</div><img src="img/community-users-icon.png" style="width:32px; height:32px;">'},
{start: new Date(2010,7,23,23,0,0), content: '<div>Mail from boss</div><img src="img/mail-icon.png" style="width:32px; height:32px;">'},
{start: new Date(2010,7,24,16,0,0), content: 'Report'},
{start: new Date(2010,7,26), end: new Date(2010,8,2), content: 'Traject A'},
@ -75,6 +77,7 @@
{start: new Date(2010,7,31), end: new Date(2010,8,3), content: 'Traject B'},
{start: new Date(2010,8,4,12,0,0), content: '<div>Report</div><img src="img/attachment-icon.png" style="width:32px; height:32px;">'}
];
var options = {
editable: true,
margin: {
@ -82,6 +85,7 @@
axis: 40
}
};
var timeline = new vis.Timeline(container, items, options);
</script>
</body>

+ 1
- 0
examples/timeline/15_item_class_names.html View File

@ -73,6 +73,7 @@
<script type="text/javascript">
// create data
// note that months are zero-based in the JavaScript Date object
var data = [
{
'start': new Date(2012,7,19),

+ 1
- 1
package.json View File

@ -1,6 +1,6 @@
{
"name": "vis",
"version": "1.0.0",
"version": "1.0.1",
"description": "A dynamic, browser-based visualization library.",
"homepage": "http://visjs.org/",
"repository": {

+ 42
- 0
src/graph/Graph.js View File

@ -557,6 +557,17 @@ Graph.prototype.setOptions = function (options) {
}
}
}
if (options.physics.hierarchicalRepulsion) {
this.constants.hierarchicalLayout.enabled = true;
this.constants.physics.hierarchicalRepulsion.enabled = true;
this.constants.physics.barnesHut.enabled = false;
for (prop in options.physics.hierarchicalRepulsion) {
if (options.physics.hierarchicalRepulsion.hasOwnProperty(prop)) {
this.constants.physics.hierarchicalRepulsion[prop] = options.physics.hierarchicalRepulsion[prop];
}
}
}
}
if (options.hierarchicalLayout) {
@ -960,6 +971,7 @@ Graph.prototype._handleOnDrag = function(event) {
this.drag.translation.y + diffY);
this._redraw();
this.moving = true;
this.start();
}
};
@ -1069,6 +1081,13 @@ Graph.prototype._zoom = function(scale, pointer) {
this.updateClustersDefault();
this._redraw();
if (scaleOld < scale) {
this.emit("zoom", {direction:"+"});
}
else {
this.emit("zoom", {direction:"-"});
}
return scale;
};
@ -1662,6 +1681,8 @@ Graph.prototype._setTranslation = function(offsetX, offsetY) {
if (offsetY !== undefined) {
this.translation.y = offsetY;
}
this.emit('viewChanged');
};
/**
@ -1734,6 +1755,27 @@ Graph.prototype._yToCanvas = function(y) {
return y * this.scale + this.translation.y ;
};
/**
*
* @param {object} pos = {x: number, y: number}
* @returns {{x: number, y: number}}
* @constructor
*/
Graph.prototype.DOMtoCanvas = function(pos) {
return {x:this._xToCanvas(pos.x),y:this._yToCanvas(pos.y)};
}
/**
*
* @param {object} pos = {x: number, y: number}
* @returns {{x: number, y: number}}
* @constructor
*/
Graph.prototype.canvasToDOM = function(pos) {
return {x:this._canvasToX(pos.x),y:this._canvasToY(pos.y)};
}
/**
* Redraw all nodes
* The 2d context of a HTML canvas can be retrieved by canvas.getContext('2d');

+ 2
- 2
src/graph/Groups.js View File

@ -2,10 +2,10 @@
* @class Groups
* This class can store groups and properties specific for groups.
*/
Groups = function () {
function Groups() {
this.clear();
this.defaultIndex = 0;
};
}
/**

+ 2
- 2
src/graph/Images.js View File

@ -2,11 +2,11 @@
* @class Images
* This class loads images and keeps them stored.
*/
Images = function () {
function Images() {
this.images = {};
this.callback = undefined;
};
}
/**
* Set an onload callback function. This will be called each time an image

+ 6
- 4
src/graph/graphMixins/physics/PhysicsMixin.js View File

@ -641,10 +641,12 @@ function switchConfigurations () {
this.constants.physics.barnesHut.enabled = false;
}
else if (radioButton == "H") {
this.constants.hierarchicalLayout.enabled = true;
this.constants.physics.hierarchicalRepulsion.enabled = true;
this.constants.physics.barnesHut.enabled = false;
this._setupHierarchicalLayout();
if (this.constants.hierarchicalLayout.enabled == false) {
this.constants.hierarchicalLayout.enabled = true;
this.constants.physics.hierarchicalRepulsion.enabled = true;
this.constants.physics.barnesHut.enabled = false;
this._setupHierarchicalLayout();
}
}
else {
this.constants.hierarchicalLayout.enabled = false;

+ 2
- 2
src/timeline/TimeStep.js View File

@ -24,7 +24,7 @@
* @param {Date} [end] The end date
* @param {Number} [minimumStep] Optional. Minimum step size in milliseconds
*/
TimeStep = function(start, end, minimumStep) {
function TimeStep(start, end, minimumStep) {
// variables
this.current = new Date();
this._start = new Date();
@ -36,7 +36,7 @@ TimeStep = function(start, end, minimumStep) {
// initialize the range
this.setRange(start, end, minimumStep);
};
}
/// enum scale
TimeStep.SCALE = {

+ 3
- 1
src/timeline/component/ItemSet.js View File

@ -813,7 +813,9 @@ ItemSet.prototype._updateItem = function _updateItem(item, itemData) {
var oldGroupId = item.data.group;
item.data = itemData;
item.repaint();
if (item.displayed) {
item.repaint();
}
// update group
if (oldGroupId != item.data.group) {

+ 4
- 3
src/timeline/component/item/ItemRangeOverflow.js View File

@ -46,9 +46,10 @@ ItemRangeOverflow.prototype.repositionX = function repositionX() {
this.left = start;
var boxWidth = Math.max(end - start, 1);
this.width = (this.props.content.width < boxWidth) ?
boxWidth :
start + contentLeft + this.props.content.width;
this.width = boxWidth + this.props.content.width;
// Note: The calculation of width is an optimistic calculation, giving
// a width which will not change when moving the Timeline
// So no restacking needed, which is nicer for the eye
this.dom.box.style.left = this.left + 'px';
this.dom.box.style.width = boxWidth + 'px';

+ 1
- 1
src/util.js View File

@ -107,7 +107,7 @@ util.extend = function (a, b) {
util.equalArray = function (a, b) {
if (a.length != b.length) return false;
for (var i = 1, len = a.length; i < len; i++) {
for (var i = 0, len = a.length; i < len; i++) {
if (a[i] != b[i]) return false;
}

Loading…
Cancel
Save