Временная шкала Vis - заставить подгруппу 2 следовать за подгруппой 1, используя порядок подгрупп

У меня есть график времени, в котором у меня есть 3 подгруппы 1, 2 и 3. В подгруппе 2 у меня есть 2 предмета с именами "B" и "BB". Я создал временную шкалу с заказным порядком подгруппы. На выходе я получаю BB сверху, затем элементы A и C ниже BB и, наконец, B в конце, даже когда BB и B совместно используют одну и ту же подгруппу 2. Вместо этого я хочу, чтобы A вышла на вершину, затем B и BB сгруппированы вместе ниже A и, наконец, C в конце. По сути, я хочу, чтобы подгруппы всегда выглядели как кластер и были вместе на временной шкале.

Ссылка на нерабочий пример - Демо

HTML

<body>
  <div id="visualization"></div>
</body>

JS

function customSubgroupOrder(a, b) {
  return b.subgroup - a.subgroup;
}

var items = [{
  id: 1,
  group: "X",
  content: "A",
  subgroup: 1,
  start: "2016-01-01",
  end: "2016-01-31"
}, {
  id: 2,
  group: "X",
  content: "B",
  subgroup: 2,
  start: "2016-01-15",
  end: "2016-02-29"
}, {
  id: 4,
  group: "X",
  content: "BB",
  subgroup: 2,
  start: "2016-01-19",
  end: "2016-02-21"
}, {
  id: 3,
  group: "X",
  content: "C",
  subgroup: 3,
  start: "2016-02-15",
  end: "2016-02-29"
}];
var groups = [{
  id: "X",
  content: "Custom Ordering<br>Top-to-Bottom",
  subgroupOrder: customSubgroupOrder
}];
var options = {
  stack: true
};

var el = document.getElementById('visualization');
var timeline = new vis.Timeline(el, items, groups, options);

Любая помощь будет оценена.

1 ответ

Вы должны добавить subgroupStack:true вариант для группы x он будет размещать свои подгруппы поверх каждой. Вы можете найти рабочую демонстрацию здесь.

Другие вопросы по тегам