3

不知道该怎么做，但我在我的项目中使用 vis.js，我需要显示营业时间的时间表。有没有办法只显示营业时间而不是整个 24 小时，因为晚上的时间对我的申请毫无意义。

我似乎无法在文档中找到在我的代码选项中进行此设置的选项。

4

1 回答 1

2

您正在寻找的文档是“隐藏期间”示例：http: //visjs.org/examples/timeline/other/hidingPeriods.html

要隐藏周末，您需要提供任何周末日期：

要隐藏周末，请选择任何星期六作为开始，然后选择下一个星期一作为结束，并将重复设置为每周。

要隐藏上午 9 点到下午 5 点之外的时间，您可以提供任意一天的范围，开始时间为下午 5 点，结束时间为晚上 9 点：

{
    start: '2017-03-04 17:00:00',
    end: '2017-03-05 09:00:00',
    repeat: 'daily'
}

下面是一个小例子：

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

// sample timeline entry
var items = new vis.DataSet([{
  id: 1,
  content: 'foo',
  start: '2017-06-13 10:00:00',
  end: '2017-06-13 16:30:00'
}]);

// Configuration for the Timeline
var options = {
  // hide weekends - use any weekend and repeat weekly
  hiddenDates: [{
      start: '2017-03-04 00:00:00',
      end: '2017-03-06 00:00:00',
      repeat: 'weekly'
    },
    // hide outside of 9am to 5pm - use any 2 days and repeat daily
    {
      start: '2017-03-04 17:00:00',
      end: '2017-03-05 09:00:00',
      repeat: 'daily'
    }
  ],
  // start and end of timeline
  start: '2017-06-01',
  end: '2017-06-30',
  height: '140px',
  editable: false
};

// Create a Timeline
var timeline = new vis.Timeline(container, items, options);
<link href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.20.0/vis.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/vis/4.20.0/vis.min.js"></script>

<h3>Mon-Fri 9am to 5pm working hours timeline example</h3>
<div id="timeline"></div>

于 2017-06-08T13:34:43.550 回答