设置过去的背景颜色

Question

我希望能够将vis.js时间轴的过去变灰。我能够显示它：

＆＃13;

＆＃13;

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

var items = new vis.DataSet([]);

var timeline = new vis.Timeline(container, items, {});

＆＃13;

<script src="http://visjs.org/dist/vis.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.14.0/vis.css">
<p>
  A basic timeline. You can move and zoom the timeline, and select items.
</p>

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

＆＃13;

＆＃13;

＆＃13;

但我无法在the doc中找到任何类似vis-past的课程来设置背景颜色。

我想实现这个目标：

Answer 1

对于将来的参考，只需创建一个没有内容的项目，最短的日期作为开始，现在作为结束：

{id: 'past', content: '', start: new Date(-8640000000000000), end: Date(), type: 'background'}

在这里工作：

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

var items = new vis.DataSet([{id: 'past', content: '', start: new Date(-8640000000000000), end: Date(), type: 'background'}]);

 var options = {
    start: '2016-01-01',
    end: '2016-04-01',
    editable: false
  };

var timeline = new vis.Timeline(container, items, options);

.vis-item.vis-background {
  background-color: rgba(222,222,222,0.5) !important;
}

body{
  background-color:white;
}

<script src="http://visjs.org/dist/vis.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.14.0/vis.css">

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