Browse Source

Merge remote-tracking branch 'origin/v4' into v4

Conflicts:
	dist/vis.js
flowchartTest
Alex de Mulder 9 years ago
parent
commit
f22a096b12
34 changed files with 108 additions and 89 deletions
  1. +1
    -0
      HISTORY.md
  2. +1
    -1
      dist/vis.map
  3. +23
    -18
      dist/vis.min.js
  4. +1
    -1
      docs/dataset.html
  5. +1
    -1
      docs/dataview.html
  6. +0
    -0
      docs/graph2d/index.html
  7. +1
    -1
      docs/graph3d.html
  8. +1
    -1
      docs/index.html
  9. +0
    -0
      docs/old/lib/prettify/lang-apollo.js
  10. +0
    -0
      docs/old/lib/prettify/lang-css.js
  11. +0
    -0
      docs/old/lib/prettify/lang-hs.js
  12. +0
    -0
      docs/old/lib/prettify/lang-lisp.js
  13. +0
    -0
      docs/old/lib/prettify/lang-lua.js
  14. +0
    -0
      docs/old/lib/prettify/lang-ml.js
  15. +0
    -0
      docs/old/lib/prettify/lang-proto.js
  16. +0
    -0
      docs/old/lib/prettify/lang-scala.js
  17. +0
    -0
      docs/old/lib/prettify/lang-sql.js
  18. +0
    -0
      docs/old/lib/prettify/lang-vb.js
  19. +0
    -0
      docs/old/lib/prettify/lang-vhdl.js
  20. +0
    -0
      docs/old/lib/prettify/lang-wiki.js
  21. +0
    -0
      docs/old/lib/prettify/lang-yaml.js
  22. +0
    -0
      docs/old/lib/prettify/prettify.css
  23. +0
    -0
      docs/old/lib/prettify/prettify.js
  24. +10
    -10
      docs/old/old_graph2d.html
  25. +3
    -3
      docs/old/old_network.html
  26. +4
    -4
      docs/old/old_timeline.html
  27. +13
    -13
      docs/timeline/index.html
  28. +5
    -5
      examples/timeline/32_grid_styling.html
  29. +6
    -6
      lib/timeline/Graph2d.js
  30. +1
    -1
      lib/timeline/Range.js
  31. +12
    -12
      lib/timeline/TimeStep.js
  32. +6
    -6
      lib/timeline/Timeline.js
  33. +11
    -5
      lib/timeline/component/ItemSet.js
  34. +8
    -1
      test/timeline_groups.html

+ 1
- 0
HISTORY.md View File

@ -27,6 +27,7 @@ http://visjs.org
- Deprecated event `finishedRedraw` as it's redundant.
- Renamed option `animate` to `animation`, and changed it to be either a boolean
or an object `{duration: number, easingFunction: string}`.
- Fixed #831: items losing selection when their type changed.
### Graph2d

+ 1
- 1
dist/vis.map
File diff suppressed because it is too large
View File


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


+ 1
- 1
docs/dataset.html View File

@ -7,7 +7,7 @@
<link href="css/prettify.css" type="text/css" rel="stylesheet" />
<link href='css/style.css' type='text/css' rel='stylesheet'>
<script type="text/javascript" src="lib/prettify/prettify.js"></script>
<script type="text/javascript" src="js/prettify/prettify.js"></script>
<script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');ga('create', 'UA-61231638-1', 'auto');ga('send', 'pageview');</script></head>
<body onload="prettyPrint();">

+ 1
- 1
docs/dataview.html View File

@ -7,7 +7,7 @@
<link href="css/prettify.css" type="text/css" rel="stylesheet" />
<link href='css/style.css' type='text/css' rel='stylesheet'>
<script type="text/javascript" src="lib/prettify/prettify.js"></script>
<script type="text/javascript" src="js/prettify/prettify.js"></script>
<script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');ga('create', 'UA-61231638-1', 'auto');ga('send', 'pageview');</script></head>
<body onload="prettyPrint();">

docs/graph2d/graph2d.html → docs/graph2d/index.html View File


+ 1
- 1
docs/graph3d.html View File

@ -6,7 +6,7 @@
<link href='css/prettify.css' type='text/css' rel='stylesheet'>
<link href='css/style.css' type='text/css' rel='stylesheet'>
<script type="text/javascript" src="lib/prettify/prettify.js"></script>
<script type="text/javascript" src="js/prettify/prettify.js"></script>
<script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');ga('create', 'UA-61231638-1', 'auto');ga('send', 'pageview');</script></head>
<body onload="prettyPrint();">

+ 1
- 1
docs/index.html View File

@ -7,7 +7,7 @@
<link href="css/prettify.css" type="text/css" rel="stylesheet" />
<link href='css/style.css' type='text/css' rel='stylesheet'>
<script type="text/javascript" src="lib/prettify/prettify.js"></script>
<script type="text/javascript" src="js/prettify/prettify.js"></script>
<script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');ga('create', 'UA-61231638-1', 'auto');ga('send', 'pageview');</script></head>
<body onload="prettyPrint();">

docs/lib/prettify/lang-apollo.js → docs/old/lib/prettify/lang-apollo.js View File


docs/lib/prettify/lang-css.js → docs/old/lib/prettify/lang-css.js View File


docs/lib/prettify/lang-hs.js → docs/old/lib/prettify/lang-hs.js View File


docs/lib/prettify/lang-lisp.js → docs/old/lib/prettify/lang-lisp.js View File


docs/lib/prettify/lang-lua.js → docs/old/lib/prettify/lang-lua.js View File


docs/lib/prettify/lang-ml.js → docs/old/lib/prettify/lang-ml.js View File


docs/lib/prettify/lang-proto.js → docs/old/lib/prettify/lang-proto.js View File


docs/lib/prettify/lang-scala.js → docs/old/lib/prettify/lang-scala.js View File


docs/lib/prettify/lang-sql.js → docs/old/lib/prettify/lang-sql.js View File


docs/lib/prettify/lang-vb.js → docs/old/lib/prettify/lang-vb.js View File


docs/lib/prettify/lang-vhdl.js → docs/old/lib/prettify/lang-vhdl.js View File


docs/lib/prettify/lang-wiki.js → docs/old/lib/prettify/lang-wiki.js View File


docs/lib/prettify/lang-yaml.js → docs/old/lib/prettify/lang-yaml.js View File


docs/lib/prettify/prettify.css → docs/old/lib/prettify/prettify.css View File


docs/lib/prettify/prettify.js → docs/old/lib/prettify/prettify.js View File


docs/old_graph2d.html → docs/old/old_graph2d.html View File

@ -7,8 +7,8 @@
background-color: #c9ffc7;
}
</style>
<link href='css/prettify.css' type='text/css' rel='stylesheet'>
<link href='css/style.css' type='text/css' rel='stylesheet'>
<link href='../css/prettify.css' type='text/css' rel='stylesheet'>
<link href='../css/style.css' type='text/css' rel='stylesheet'>
<script type="text/javascript" src="lib/prettify/prettify.js"></script>
<script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');ga('create', 'UA-61231638-1', 'auto');ga('send', 'pageview');</script></head>
@ -55,7 +55,7 @@
<h2 id="Example">Example</h2>
<p>
The following code shows how to create a Graph2d and provide it with data.
More examples can be found in the <a href="../examples">examples</a> directory.
More examples can be found in the <a href="../../examples">examples</a> directory.
</p>
<pre class="prettyprint lang-html">
@ -275,7 +275,7 @@ The options colored in green can also be used as options for the groups. All opt
<td class="greenField">yAxisOrientation</td>
<td>String</td>
<td>'left'</td>
<td>This defines with which axis, left or right, the graph is coupled. <a href="../examples/graph2d/05_bothAxis.html">Example 5</a> shows groups with different Y axis. If no groups are coupled
<td>This defines with which axis, left or right, the graph is coupled. <a href="../../examples/graph2d/05_bothAxis.html">Example 5</a> shows groups with different Y axis. If no groups are coupled
with an axis, it will not be shown.</td>
</tr>
<tr>
@ -354,8 +354,8 @@ The options colored in green can also be used as options for the groups. All opt
<td>'overlap'</td>
<td>You can choose how graph2d handles the case where barcharts are occupying the same datapoint. The possible options are:
<code>overlap, sideBySide, stack</code>.
See <a href="../examples/graph2d/10_barsSideBySide.html">example 10</a> for more information.
When using groups, see <a href="../examples/graph2d/11_barsSideBySideGroups.html">example 11</a>.
See <a href="../../examples/graph2d/10_barsSideBySide.html">example 10</a> for more information.
When using groups, see <a href="../../examples/graph2d/11_barsSideBySideGroups.html">example 11</a>.
</td>
</tr>
<tr>
@ -374,7 +374,7 @@ The options colored in green can also be used as options for the groups. All opt
<td class="greenField">catmullRom.parametrization</td>
<td>String</td>
<td>'centripetal'</td>
<td>Define the type of parametrizaion. <a href="../examples/graph2d/07_scrollingAndSorting.html">Example 7</a> shows the different methods. The options are 'centripetal' (best results), 'chordal' and 'uniform'. Uniform is the computationally cheapest variant.
<td>Define the type of parametrizaion. <a href="../../examples/graph2d/07_scrollingAndSorting.html">Example 7</a> shows the different methods. The options are 'centripetal' (best results), 'chordal' and 'uniform'. Uniform is the computationally cheapest variant.
If catmullRom is disabled, linear interpolation is used.</td>
</tr>
<tr>
@ -507,7 +507,7 @@ The options colored in green can also be used as options for the groups. All opt
<td>Object</td>
<td></td>
<td>You can use this to toggle the visibility of groups per graph2D instance. This is different from setting the visibility flag of the groups since
this is not communicated across instances of graph2d. Take a look at <a href="../examples/graph2d/14_toggleGroups.html">Example 14</a>
this is not communicated across instances of graph2d. Take a look at <a href="../../examples/graph2d/14_toggleGroups.html">Example 14</a>
for more explanation.
</td>
</tr>
@ -1150,8 +1150,8 @@ Graph2d comes with support for the following locales:
</p>
<p>
Additionally, Graph2d has 10 preset styles for graphs, which are cycled through when loading groups. These styles can be overwritten
as well, along with defining your own classes to style the graphs! <a href="../examples/graph2d/04_rightAxis.html">Example 4</a> and
<a href="../examples/graph2d/05_bothAxis.html">example 5</a> show the usage of custom styles.
as well, along with defining your own classes to style the graphs! <a href="../../examples/graph2d/04_rightAxis.html">Example 4</a> and
<a href="../../examples/graph2d/05_bothAxis.html">example 5</a> show the usage of custom styles.
</p>
<h2 id="Data_Policy">Data Policy</h2>

docs/old_network.html → docs/old/old_network.html View File

@ -4,8 +4,8 @@
<head>
<title>vis.js | network documentation</title>
<link href="css/prettify.css" type="text/css" rel="stylesheet" />
<link href='css/style.css' type='text/css' rel='stylesheet'>
<link href="../css/prettify.css" type="text/css" rel="stylesheet" />
<link href='../css/style.css' type='text/css' rel='stylesheet'>
<style>td.greenField {
background-color: #c9ffc7;
}</style>
@ -90,7 +90,7 @@
<p>
More examples can be found in the
<a href="../examples" target="_blank">examples directory</a>.
<a href="../../examples" target="_blank">examples directory</a>.
</p>
<pre class="prettyprint lang-html">&lt;!doctype html&gt;

docs/old_timeline.html → docs/old/old_timeline.html View File

@ -3,8 +3,8 @@
<head>
<title>vis.js | timeline documentation</title>
<link href='css/prettify.css' type='text/css' rel='stylesheet'>
<link href='css/style.css' type='text/css' rel='stylesheet'>
<link href='../css/prettify.css' type='text/css' rel='stylesheet'>
<link href='../css/style.css' type='text/css' rel='stylesheet'>
<script type="text/javascript" src="lib/prettify/prettify.js"></script>
<script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');ga('create', 'UA-61231638-1', 'auto');ga('send', 'pageview');</script></head>
@ -52,7 +52,7 @@
<h2 id="Example">Example</h2>
<p>
The following code shows how to create a Timeline and provide it with data.
More examples can be found in the <a href="../examples">examples</a> directory.
More examples can be found in the <a href="../../examples">examples</a> directory.
</p>
<pre class="prettyprint lang-html">&lt;!DOCTYPE HTML&gt;
@ -1286,7 +1286,7 @@ var options = {
};
</pre>
A full example is available here: <a href="../examples/timeline/08_manipulation_callbacks.html">08_edit_items.html</a>.
A full example is available here: <a href="../../examples/timeline/08_manipulation_callbacks.html">08_edit_items.html</a>.
<h2 id="Templates">Templates</h2>

+ 13
- 13
docs/timeline/index.html View File

@ -1522,28 +1522,28 @@ var options = {
<td>Description</td><td>values</td>
</tr>
<tr>
<td>Alternating columns</td><td class="mid"><code>even</code>, <code>odd</code></td>
<td>Alternating columns</td><td class="mid"><code>vis-even</code>, <code>vis-odd</code></td>
</tr>
<tr>
<td>Current date</td><td class="mid"><code>today</code>, <code>tomorrow</code>, <code>yesterday</code>, <code>current-week</code>, <code>current-month</code>, <code>current-year</code></td>
<td>Current date</td><td class="mid"><code>vis-today</code>, <code>vis-tomorrow</code>, <code>vis-yesterday</code>, <code>vis-current-week</code>, <code>vis-current-month</code>, <code>vis-current-year</code></td>
</tr>
<tr>
<td>Hours</td><td class="mid"><code>h0</code>, <code>h1</code>, ..., <code>h23</code></td>
<td>Hours</td><td class="mid"><code>vis-h0</code>, <code>vis-h1</code>, ..., <code>vis-h23</code></td>
</tr>
<tr>
<td>Grouped hours</td><td class="mid"><code>h0-h4</code> to <code>h20-h24</code></td>
<td>Grouped hours</td><td class="mid"><code>vis-h0-h4</code> to <code>vis-h20-h24</code></td>
</tr>
<tr>
<td>Weekday</td><td class="mid"><code>monday</code>, <code>tuesday</code>, <code>wednesday</code>, <code>thursday</code>, <code>friday</code>, <code>saturday</code>, <code>sunday</code></td>
<td>Weekday</td><td class="mid"><code>vis-monday</code>, <code>vis-tuesday</code>, <code>vis-wednesday</code>, <code>vis-thursday</code>, <code>vis-friday</code>, <code>vis-saturday</code>, <code>vis-sunday</code></td>
</tr>
<tr>
<td>Days</td><td class="mid"><code>date1</code>, <code>date2</code>, ..., <code>date31</code></td>
<td>Days</td><td class="mid"><code>vis-date1</code>, <code>vis-date2</code>, ..., <code>vis-date31</code></td>
</tr>
<tr>
<td>Months</td><td class="mid"><code>januari</code>, <code>februari</code>, <code>march</code>, <code>april</code>, <code>may</code>, <code>june</code>, <code>july</code>, <code>august</code>, <code>september</code>, <code>october</code>, <code>november</code>, <code>december</code></td>
<td>Months</td><td class="mid"><code>vis-januari</code>, <code>vis-februari</code>, <code>vis-march</code>, <code>vis-april</code>, <code>vis-may</code>, <code>vis-june</code>, <code>vis-july</code>, <code>vis-august</code>, <code>vis-september</code>, <code>vis-october</code>, <code>vis-november</code>, <code>vis-december</code></td>
</tr>
<tr>
<td>Years</td><td class="mid"><code>year2014</code>, <code>year2015</code>, ...</td>
<td>Years</td><td class="mid"><code>vis-year2014</code>, <code>vis-year2015</code>, ...</td>
</tr>
</table>
@ -1551,17 +1551,17 @@ var options = {
<pre class="prettyprint lang-html">&lt;style&gt;
/* alternating column backgrounds */
.vis-time-axis .grid.odd {
.vis-time-axis .grid.vis-odd {
background: #f5f5f5;
}
/* gray background in weekends, white text color */
.vis-time-axis .vis-grid.saturday,
.vis-time-axis .vis-grid.sunday {
.vis-time-axis .vis-grid.vis-saturday,
.vis-time-axis .vis-grid.vis-sunday {
background: gray;
}
.vis-time-axis .vis-text.saturday,
.vis-time-axis .vis-text.sunday {
.vis-time-axis .vis-text.vis-saturday,
.vis-time-axis .vis-text.vis-sunday {
color: white;
}
&lt;/style&gt;

+ 5
- 5
examples/timeline/32_grid_styling.html View File

@ -12,17 +12,17 @@
}
/* alternating column backgrounds */
.vis-time-axis .vis-grid.odd {
.vis-time-axis .vis-grid.vis-odd {
background: #f5f5f5;
}
/* gray background in weekends, white text color */
.vis-time-axis .vis-grid.saturday,
.vis-time-axis .vis-grid.sunday {
.vis-time-axis .vis-grid.vis-saturday,
.vis-time-axis .vis-grid.vis-sunday {
background: gray;
}
.vis-time-axis .vis-text.saturday,
.vis-time-axis .vis-text.sunday {
.vis-time-axis .vis-text.vis-saturday,
.vis-time-axis .vis-text.vis-sunday {
color: white;
}
</style>

+ 6
- 6
lib/timeline/Graph2d.js View File

@ -266,10 +266,10 @@ Graph2d.prototype.getItemRange = function() {
* The event happened, whether clicked on an item, etc.
*/
Graph2d.prototype.getEventProperties = function (event) {
var pageX = event.center ? event.center.x : event.pageX;
var pageY = event.center ? event.center.y : event.pageY;
var x = pageX - util.getAbsoluteLeft(this.dom.centerContainer);
var y = pageY - util.getAbsoluteTop(this.dom.centerContainer);
var clientX = event.center ? event.center.x : event.clientX;
var clientY = event.center ? event.center.y : event.clientY;
var x = clientX - util.getAbsoluteLeft(this.dom.centerContainer);
var y = clientY - util.getAbsoluteTop(this.dom.centerContainer);
var time = this._toTime(x);
var customTime = CustomTime.customTimeFromTarget(event);
@ -299,8 +299,8 @@ Graph2d.prototype.getEventProperties = function (event) {
return {
event: event,
what: what,
pageX: pageX,
pageY: pageY,
pageX: event.srcEvent ? event.srcEvent.pageX : event.pageX,
pageY: event.srcEvent ? event.srcEvent.pageY : event.pageY,
x: x,
y: y,
time: time,

+ 1
- 1
lib/timeline/Range.js View File

@ -491,7 +491,7 @@ Range.prototype._onMouseWheel = function(event) {
}
// calculate center, the date to zoom around
var pointer = getPointer({x: event.pageX, y: event.pageY}, this.body.dom.center);
var pointer = getPointer({x: event.clientX, y: event.clientY}, this.body.dom.center);
var pointerDate = this._pointerToDate(pointer);
this.zoom(scale, pointerDate, delta);

+ 12
- 12
lib/timeline/TimeStep.js View File

@ -535,32 +535,32 @@ TimeStep.prototype.getClassName = function() {
var step = this.step;
function even(value) {
return (value / step % 2 == 0) ? ' even' : ' odd';
return (value / step % 2 == 0) ? ' vis-even' : ' vis-odd';
}
function today(date) {
if (date.isSame(new Date(), 'day')) {
return ' today';
return ' vis-today';
}
if (date.isSame(moment().add(1, 'day'), 'day')) {
return ' tomorrow';
return ' vis-tomorrow';
}
if (date.isSame(moment().add(-1, 'day'), 'day')) {
return ' yesterday';
return ' vis-yesterday';
}
return '';
}
function currentWeek(date) {
return date.isSame(new Date(), 'week') ? ' current-week' : '';
return date.isSame(new Date(), 'week') ? ' vis-current-week' : '';
}
function currentMonth(date) {
return date.isSame(new Date(), 'month') ? ' current-month' : '';
return date.isSame(new Date(), 'month') ? ' vis-current-month' : '';
}
function currentYear(date) {
return date.isSame(new Date(), 'year') ? ' current-year' : '';
return date.isSame(new Date(), 'year') ? ' vis-current-year' : '';
}
switch (this.scale) {
@ -578,24 +578,24 @@ TimeStep.prototype.getClassName = function() {
if (this.step == 4) {
hours = hours + '-h' + (hours + 4);
}
return 'h' + hours + today(date) + even(date.hours());
return 'vis-h' + hours + today(date) + even(date.hours());
case 'weekday':
return date.format('dddd').toLowerCase() +
return 'vis-' + date.format('dddd').toLowerCase() +
today(date) + currentWeek(date) + even(date.date());
case 'day':
var day = date.date();
var month = date.format('MMMM').toLowerCase();
return 'day' + day + ' ' + month + currentMonth(date) + even(day - 1);
return 'vis-day' + day + ' vis-' + month + currentMonth(date) + even(day - 1);
case 'month':
return date.format('MMMM').toLowerCase() +
return 'vis-' + date.format('MMMM').toLowerCase() +
currentMonth(date) + even(date.month());
case 'year':
var year = date.year();
return 'year' + year + currentYear(date)+ even(year);
return 'vis-year' + year + currentYear(date)+ even(year);
default:
return '';

+ 6
- 6
lib/timeline/Timeline.js View File

@ -389,10 +389,10 @@ Timeline.prototype.getItemRange = function() {
* The event happened, whether clicked on an item, etc.
*/
Timeline.prototype.getEventProperties = function (event) {
var pageX = event.center ? event.center.x : event.pageX;
var pageY = event.center ? event.center.y : event.pageY;
var x = pageX - util.getAbsoluteLeft(this.dom.centerContainer);
var y = pageY - util.getAbsoluteTop(this.dom.centerContainer);
var clientX = event.center ? event.center.x : event.clientX;
var clientY = event.center ? event.center.y : event.clientY;
var x = clientX - util.getAbsoluteLeft(this.dom.centerContainer);
var y = clientY - util.getAbsoluteTop(this.dom.centerContainer);
var item = this.itemSet.itemFromTarget(event);
var group = this.itemSet.groupFromTarget(event);
@ -419,8 +419,8 @@ Timeline.prototype.getEventProperties = function (event) {
item: item ? item.id : null,
group: group ? group.groupId : null,
what: what,
pageX: pageX,
pageY: pageY,
pageX: event.srcEvent ? event.srcEvent.pageX : event.pageX,
pageY: event.srcEvent ? event.srcEvent.pageY : event.pageY,
x: x,
y: y,
time: time,

+ 11
- 5
lib/timeline/component/ItemSet.js View File

@ -818,11 +818,13 @@ ItemSet.prototype._onUpdate = function(ids) {
var type = me._getType(itemData);
var constructor = ItemSet.types[type];
var selected;
if (item) {
// update item
if (!constructor || !(item instanceof constructor)) {
// item type has changed, delete the item and recreate it
selected = item.selected; // preserve selection of this item
me._removeItem(item);
item = null;
}
@ -837,6 +839,10 @@ ItemSet.prototype._onUpdate = function(ids) {
item = new constructor(itemData, me.conversion, me.options);
item.id = id; // TODO: not so nice setting id afterwards
me._addItem(item);
if (selected) {
this.selection.push(id);
item.select();
}
}
else if (type == 'rangeoverflow') {
// TODO: deprecated since version 2.1.0 (or 3.0.0?). cleanup some day
@ -847,7 +853,7 @@ ItemSet.prototype._onUpdate = function(ids) {
throw new TypeError('Unknown item type "' + type + '"');
}
}
});
}.bind(this));
this._order();
this.stackDirty = true; // force re-stacking of all items next redraw
@ -1585,23 +1591,23 @@ ItemSet.prototype.itemFromTarget = function(event) {
* @return {Group | null} group
*/
ItemSet.prototype.groupFromTarget = function(event) {
var pageY = event.center ? event.center.y : event.pageY;
var clientY = event.center ? event.center.y : event.clientY;
for (var i = 0; i < this.groupIds.length; i++) {
var groupId = this.groupIds[i];
var group = this.groups[groupId];
var foreground = group.dom.foreground;
var top = util.getAbsoluteTop(foreground);
if (pageY > top && pageY < top + foreground.offsetHeight) {
if (clientY > top && clientY < top + foreground.offsetHeight) {
return group;
}
if (this.options.orientation.item === 'top') {
if (i === this.groupIds.length - 1 && pageY > top) {
if (i === this.groupIds.length - 1 && clientY > top) {
return group;
}
}
else {
if (i === 0 && pageY < top + foreground.offset) {
if (i === 0 && clientY < top + foreground.offset) {
return group;
}
}

+ 8
- 1
test/timeline_groups.html View File

@ -28,6 +28,8 @@
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js"></script>
<script src="../dist/vis.js"></script>
<link href="../dist/vis.css" rel="stylesheet" type="text/css" />
<script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');ga('create', 'UA-61231638-1', 'auto');ga('send', 'pageview');</script></head>
@ -52,6 +54,7 @@
<br>
<div id="visualization"></div>
<div style="height: 1000px;"></div><!-- for testing vertical scroll on touch devices-->
<script>
var moment = vis.moment;
@ -189,11 +192,15 @@
console.log('rangechanged', range);
});
*/
//
timeline.on('click', function (props) {
console.log('click', props);
});
$(container).click(function (event) {
console.log('click jquery', timeline.getEventProperties(event));
});
timeline.on('doubleClick', function (props) {
console.log('doubleClick', props);
});

Loading…
Cancel
Save