Vis.js 时间线不只显示今天的一项
Vis.js Timeline not showing only one today item
如果我只想显示今天的一项,则不会显示任何内容,例如:(更改今天的日期)
// DOM element where the Timeline will be attached
var container = document.getElementById('visualization');
// Create a DataSet (allows two way data-binding)
var items = new vis.DataSet([
{id: 1, content: 'item 1', start: '2021-12-16'},
]);
// Configuration for the Timeline
var options = {};
// Create a Timeline
var timeline = new vis.Timeline(container, items, options);
示例码笔:https://codepen.io/nuno-soares-the-scripter/pen/xxXqvLP
链接的 CodePen 使用的是 vis.js v4.21.0,该版本于 2017 年 10 月发布,现在已弃用,因为 https://github.com/almende/vis. The issue described at https://github.com/almende/vis/issues/3616 出现在这个旧版本中。这导致 visibility: hidden;
被添加到内联的可视化元素 CSS.
两种解决方法:
1。更新到 vis-timeline
从已折旧的 vis.js v4.21.0 更新到最新版本。在 vis.js 折旧后,组件被拆分为单独的模块,时间线的模块在 https://github.com/visjs/vis-timeline.
的时间线。
根据 GitHub 示例,应更新 JavaScript 和 CSS 来源。在 CodePen 上更新这些显示时间线。
<script type="text/javascript" src="https://unpkg.com/vis-timeline@latest/standalone/umd/vis-timeline-graph2d.min.js"></script>
<link href="https://unpkg.com/vis-timeline@latest/styles/vis-timeline-graph2d.min.css" rel="stylesheet" type="text/css" />
2。设置开始日期
如果您不能使用 vis-timeline 并且必须保留此折旧版本,则向选项对象添加开始日期也会显示时间线。
var options = {start:'2021-12-16'};
如果我只想显示今天的一项,则不会显示任何内容,例如:(更改今天的日期)
// DOM element where the Timeline will be attached
var container = document.getElementById('visualization');
// Create a DataSet (allows two way data-binding)
var items = new vis.DataSet([
{id: 1, content: 'item 1', start: '2021-12-16'},
]);
// Configuration for the Timeline
var options = {};
// Create a Timeline
var timeline = new vis.Timeline(container, items, options);
示例码笔:https://codepen.io/nuno-soares-the-scripter/pen/xxXqvLP
链接的 CodePen 使用的是 vis.js v4.21.0,该版本于 2017 年 10 月发布,现在已弃用,因为 https://github.com/almende/vis. The issue described at https://github.com/almende/vis/issues/3616 出现在这个旧版本中。这导致 visibility: hidden;
被添加到内联的可视化元素 CSS.
两种解决方法:
1。更新到 vis-timeline
从已折旧的 vis.js v4.21.0 更新到最新版本。在 vis.js 折旧后,组件被拆分为单独的模块,时间线的模块在 https://github.com/visjs/vis-timeline.
的时间线。根据 GitHub 示例,应更新 JavaScript 和 CSS 来源。在 CodePen 上更新这些显示时间线。
<script type="text/javascript" src="https://unpkg.com/vis-timeline@latest/standalone/umd/vis-timeline-graph2d.min.js"></script>
<link href="https://unpkg.com/vis-timeline@latest/styles/vis-timeline-graph2d.min.css" rel="stylesheet" type="text/css" />
2。设置开始日期
如果您不能使用 vis-timeline 并且必须保留此折旧版本,则向选项对象添加开始日期也会显示时间线。
var options = {start:'2021-12-16'};