javascript - vis.js 时间轴添加按钮以显示星期或月份

Question

我正在尝试使用 vis.js 创建一个“预订”系统，因为我喜欢水平缩放布局和添加需要预订的项目的能力。我需要添加按钮，单击这些按钮将在时间轴上显示当前日期、本周或月 View 。

    <div id=""visualization></div>
    <ul class="btn-cluster">
     <li class="btn-cluster__item btn"><a class="btn-cluster__link--day">day</a></li>
    <li class="btn-cluster__item btn"><a class="btn-cluster__link--day">week</a></li>
<li class="btn-cluster__item btn"><a class="btn-cluster__link--day">month</a></li>
    </ul>




var container = document.getElementById('visualization');
var groups    = {};
var items     = new vis.DataSet([
  {
    id: 'item1',
    content: 'item content'
  },

]) ;
var options   = {};

// Create a Timeline
var timeline = new vis.Timeline(container, items, groups, options);

Answer 1

要将时间轴上的 View 设置为用户指定的范围，例如一天、一周或一个月，您可以使用

timeline.setWindow(start, end [, options]) 

例如，如果您想要将时间轴设置为关注今天且 View 宽度为 24 小时，您可以执行以下操作。

var ONE_DAY_IN_MS = 1000 * 60 * 60 * 24;
var now = new Date();
var nowInMs = now.getTime();
var oneDayFromNow = nowInMs + ONE_DAY_IN_MS;
timeline.setWindow(nowInMs, oneDayFromNow);