vis時間線如何將特定物品放在圖表底部並且所有物品仍然對齊

Question

我需要將一個特定物品放在我的可見時間線圖表的底部。渲染後，我可以使用jquery將該項目移動到圖表的底部。問題在於它可能會與下一個項目重疊。並且其他項目可能無法正確對齊。

您對此的幫助非常感謝。

感謝

這裏是代碼

https://jsfiddle.net/gbdjbdhv/28/

var container = document.getElementById('visualization'); 

var items = new vis.DataSet([ 
    {id: 1, className:'item4', content: 'item 1', start: '2016-04-10'}, 
    {id: 2, className:'item5', content: 'item 2', start: '2016-04-10'}, 
     {id: 3, className:'item4', content: 'item 3', start: '2016-04-10'}, 
     {id: 13, className:'item4', content: 'item 5', start: '2016-04-16'}, 
    {id: 4, className:'likeToBeBottom', content: 'like to put this item at bottom', start: '2016-04-16'}, 
     {id: 5, className:'item4', content: 'item 5', start: '2016-04-18'}, 
    {id: 6, className:'item5', content: 'item 6', start: '2016-04-18'}, 
     {id: 7, className:'item4', content: 'item 7', start: '2016-04-18'}, 
    {id: 8, className:'item5', content: 'item 8', start: '2016-04-18'}, 
     {id: 9, className:'item4', content: 'item 9', start: '2016-04-25'}, 
    {id: 10, className:'item5', content: 'item 10', start: '2016-04-25'}, 
    {id: 11, className:'item6', content: 'item 11', start: '2016-04-25'} 
    ]); 

    var options = { 
    showCurrentTime: true, 
      align: 'left', 
    orientation: {axis: 'both', item: 'top'}, 
    height: 400, 
    margin: { 
     axis: 100 
    } 
    }; 
    var timeline = new vis.Timeline(container, items, options); 
    if ($('.vis-current-time')){ 
     var height = $('.vis-current-time').height(); 
     $('div.vis-item.vis-box.likeToBeBottom').css({'top': height -180}); 
    } 

The problem is that the item I moved to bottom overlap with other items

[]

Answer 1

你可以使用兩組，把你想要的項目d顯示在第二組的底部。如果您想隱藏使用組的事實，則可以使用一些CSS來隱藏左側顯示的網格和組標籤。