vis.js 时间轴显示/隐藏项目（以及点和线）答案

【问题标题】：vis.js Timeline show/hide items (and dot and line)vis.js 时间轴显示/隐藏项目（以及点和线）
【发布时间】：2017-04-11 06:18:57
【问题描述】：

我编写了一些代码来按类名显示/隐藏项目。我通过将 vis-box 的不透明度更改为 0 来实现这一点。但是，当我隐藏 vis-box 时，vis-dot 和从时间轴延伸的垂直线仍然显示。我也想隐藏这些。

Image of hidden boxes with lines showing

到目前为止，我已经能够通过将border-color css 属性更改为白色来隐藏整个时间线的所有线条和点（使用 chrome 检查器）。但是，我只想隐藏属于特定类项目的点和线。

【问题讨论】：

标签： javascript vis.js

【解决方案1】：

一种解决方案是更改与时间线一起使用的数据集，根据需要删除和添加项目。

来自文档 (http://visjs.org/docs/data/dataset.html)：

dataset.add(data [, senderId]) - 向 DataSet 添加一项或多项。数据可以是单个项目或包含项目的数组。当已有具有相同 id 的项目时，添加项目将失败。该函数返回一个数组，其中包含已添加项目的 id。请参阅数据操作部分。

remove(ids [, senderId]) - 通过 id 或项目本身删除一个或多个项目。返回一个包含已删除项目 ID 的数组。请参阅数据操作部分。

您只需将要隐藏/显示的项目列表保留在变量中。

【讨论】：

【解决方案2】：

在我的例子中，为了隐藏一个项目，我将项目设置了一年来隐藏，然后设置原始日期和时间再次显示该项目。

当时间线为可见范围设置了最小日期并且无法超出此最小值时，这很有用，例如在我的情况下，时间线不能在一个月前之前移动。

那么代码可能是这样的：

function item_hide(id)
{
    var item;

    item= dataSet_items.get(id);
    if(item === null)
        return;

    item.start= moment(item.start_original).subtract(1, 'y').format("YYYY-MM-DD HH:mm:ss");
    item.end= moment(item.end_original).subtract(1, 'y').format("YYYY-MM-DD HH:mm:ss");
    item.hidden= true;
    dataSet_items.update(item);

    return item;
}


function item_show(id)
{
    var item;

    item= dataSet_items.get(id);
    if(item === null)
        return;

    item.start= item.start_original;
    item.end= item.end_original;
    item.hidden= false;
    dataSet_items.update(item);

    return item;
}

【讨论】：