问visjs时间线-在同一行中的项目在同一组中

EN

  var groups = new vis.DataSet([
    {id: 0, content: 'First', value: 1},
    {id: 1, content: 'Third', value: 3},
    {id: 2, content: 'Second', value: 2}
  ]);

  // 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)},
    {id: 2, group: 1, content: 'item 2', start: new Date(2014, 3, 16), end: new Date(2014, 3, 24)},
    {id: 3, group: 1, content: 'item 3', start: new Date(2014, 3, 23), end: new Date(2014, 3, 24)},
    {id: 4, group: 1, content: 'item 4', start: new Date(2014, 3, 22), end: new Date(2014, 3, 26)},
    {id: 5, group: 2, content: 'item 5', start: new Date(2014, 3, 24), end: new Date(2014, 3, 27)}
  ]);

  // create visualization
  var container1 = document.getElementById('visualization1');
  var container2 = document.getElementById('visualization2');
  var options1 = {
    // option groupOrder can be a property name or a sort function
    // the sort function must compare two groups and return a value
    //     > 0 when a > b
    //     < 0 when a < b
    //       0 when a == b
    groupOrder: function (a, b) {
      return a.value - b.value;
    },
    editable: true,
    stack: false
  };
  var options2 = Object.assign({}, options1);
  options2.stack = true;

  var timeline1 = new vis.Timeline(container1);
  timeline1.setOptions(options1);
  timeline1.setGroups(groups);
  timeline1.setItems(items);
  var timeline2 = new vis.Timeline(container2);
  timeline2.setOptions(options2);
  timeline2.setGroups(groups);
  timeline2.setItems(items);

<link href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.21.0/vis-timeline-graph2d.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vis/4.21.0/vis.min.js" rel="script"></script>
<p><pre>stack: false</pre>
<div id="visualization1"></div>
<p><pre>stack: true</pre>
<div id="visualization2"></div>