javascript - 如果数据为空,则 Vis.js 时间轴不可见

标签 javascript jquery vis.js

当我没有数据时,时间线不存在,但我需要一个空的时间线。 对于 3.10.0 版它可以工作,但不能用于 4.21.0 版

我希望一切都清楚...我在这里举了一个例子:

function setTable(){
      var select = document.getElementById("select");
      var value = select.options[select.selectedIndex].value;
      var container = document.getElementById('mytimeline');
      container.innerHTML = "";
      
      if(value=="full"){
          var items = new vis.DataSet([
            {id: 1, group: 1, content: 'item 1', start: '2013-04-20'},
            {id: 2, group: 2, content: 'item 2', start: '2013-04-14'},
            {id: 3, group: 3, content: 'item 3', start: '2013-04-18'},
            {id: 4, group: 3, content: 'item 4', start: '2013-04-16', end: '2013-04-19'},
            {id: 5, group: 1, content: 'item 5', start: '2013-04-25'},
            {id: 6, group: 1, content: 'item 6', start: '2013-04-27'}
          ]);

          var groups = new vis.DataSet([
            {id: 1, content: 'aaa'},
            {id: 2, content: 'bbb'},
            {id: 3, content: 'ccc'},
            {id: 4, content: 'ddd'}
          ]);
          var options = {};
          var timeline = new vis.Timeline(container, items, groups, options);
      }else if(value=="empty"){
          var items = new vis.DataSet();
          var groups = new vis.DataSet();
          var options = {};
          var timeline = new vis.Timeline(container, items, groups, options);
          
        	alert("don't work... \n I would like to have an empty TimeLine... not a \nLike I have do it in oldest version (3.10.0)\nhttp://jsfiddle.net/n427qjLm/2/");
      }
    }
    #mytimeline{
      border:1px solid gray;
      padding : 5px;
    }
    .vis.timeline .labelset .vlabel .inner {
      min-height: 100px;
    }
<script src="https://cdnjs.cloudflare.com/ajax/libs/vis/4.21.0/vis.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.21.0/vis.min.css" rel="stylesheet"/>


  <select id="select" onchange="setTable()">
    <option value="">Select</option>
    <option value="full">Full</option>
    <option value="empty">Empty</option>
  </select>
  
  <div id="mytimeline"></div>

最佳答案

当你想要一个空的时间线时,你必须在你的选项中指定“开始”:

var 选项 = { 开始:'2018-08-20' };

关于javascript - 如果数据为空,则 Vis.js 时间轴不可见,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52555817/

相关文章:

reactjs - TypeError : vis_network__WEBPACK_IMPORTED_MODULE_3__. DataSet 不是构造函数

javascript - 获取数组值并添加它们(如果它们是数字)

javascript - onblur,仅在 jquery 和 javascript 中工作一次

javascript - 在 Vis.js,时间轴,刷新显示变化数据

javascript - 商店状态更改时 React 组件不更新

javascript - jquery 中追加元素

javascript - Vis.js 时间轴无法切换嵌套组

javascript - 更新已实例化的图表数据

带字典的 JavaScript 策略模式

javascript - 检查一个必须包含另一个字符串的字符串