我无法在 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;
}