Question

不确定如何解决这个问题，但我在项目中使用了vis.js，我需要显示业务开放时间的时间表。有没有办法只显示营业时间而不是整个24小时，因为晚上的时间对我的申请毫无意义。

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

Answer 1

您正在寻找的文件是“隐藏期”＆＃39;例如：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'
}

以下是一个小例子：

＆＃13;

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);

＆＃13;

<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>

＆＃13;

Vis.js仅显示时间线中的营业时间

1 个答案: