1

我无法在 vis.js TimeLine 的轴上重叠或放置项目。像这里 http://www.iftekhar.me/ibm/ibm-project-timeline/,是否可以不更改源代码?

顺便说一下,背景项目是不可拖动的,所以我尝试使用范围,但我的时间线只有 30px 高度并且 vis-center 不可见,所以我将其顶部降至 0px,现在与我范围内奇怪的垂直移动作斗争...

我做错了什么? http://jsfiddle.net/9a5m5283/只需通过鼠标左右和上下移动

// DOM element where the Timeline will be attached
var container = document.getElementById('example-timeline');
// Create a DataSet with data 
var data = new vis.DataSet([
    {id: "2", start: '2018-04-03', end: '2018-04-04', className: "foo", type: 'range'},
    {id: "3", start: '2018-04-02', end: '2018-04-03', type: 'background'}
]);

// Configuration for the Timeline as JSON object
var options = {
    width: '100%',
    height: '30px',
    minHeight: '30px',
    start: new Date() - 1000 * 60 * 60 * 12,
    min: new Date() - 1000 * 60 * 60 * 24 *30,
    zoomMin: 1000 * 6,
    align: 'auto',
    end: new Date(),
    verticalScroll: true,
    orientation: {axis: 'top', item: 'top' },
    selectable: false,
    itemsAlwaysDraggable: {
        item: true, range: true
    },
    editable: {
        updateTime: true
    },
    margin: 0
};

// Create a Timeline
var timeline = new vis.Timeline(container, data, options);
var timelineCenterPanel = document.querySelector(".vis-panel.vis-center");
timeline.on("changed", function(props){ 
    document.querySelector(".vis-panel.vis-center").style.top = "0px" 
}) 


.vis-time-axis .vis-text {
    font-size: 70%
}

.vis-time-axis .vis-major {
    padding-bottom: 1px;
}

.vis-time-axis .vis-minor {
    padding-top: 1px;
}

.foo {
    opacity: 0.5;
    height: 35px;
}
4

0 回答 0