2016-05-25 50 views
0

我正在开发一个项目,并且需要/希望使用vis.js在时间线上显示数据。但是,由于捕获数据的方式,我需要在页面加载时动态地构建时间线的数据集。考虑到这一点,我开始试验如何做到这一点,但遇到了一个障碍,很可能是由于我自己缺乏知识。vis.js动态构建数据集

以下是我一直在使用的测试代码(我知道这不是最好的或最干净的代码,目前我专注于功能,但如果您有清除这些问题的建议,我都是耳朵!)我想要做的是使用变量数据集列表的内容来构建数据集。但是当我试图将该变量传递给新的vis.DataSet时,它不会构建可视化。我很感激任何人都可以提供的指导。我想知道是否需要以某种方式来变换这个变量,以让vis.js接受它,但一直未能弄清楚这是否确实如此,如果是的话,如何。

var ERP = "yes"; 
var ERPDate = "2018"; 
var CRM = "no"; 
var CRMDate = "2019"; 
var IDSeq = 1; 
var datasetlist = ""; 
var yesCount = 0 

//count totalitems 
if (ERP == "yes") { 
    yesCount = (yesCount + 1); 
} 

if (CRM == "yes") { 
    yesCount = (yesCount + 1); 
} 

//builddataset 
if (ERP == "yes"){ 
    if (yesCount == IDSeq) { 
    datasetlist = datasetlist + "{id: " + IDSeq + ", content: \'ERP\', start: \'" + ERPDate + "\'}"; 
} else { 
    datasetlist = datasetlist + "{id: " + IDSeq + ", content: \'ERP\', start: \'" + ERPDate + "\'},"; 
} 
IDSeq = IDSeq +1 
} 

if (CRM == "yes"){ 
    if (yesCount == IDSeq) { 
    datasetlist = datasetlist + "{id: " + IDSeq + ", content: \'CRM\', start: \'" + CRMDate + "\'}"; 
} else { 
    datasetlist = datasetlist + "{id: " + IDSeq + ", content: \'CRM\', start: \'" + CRMDate + "\'},"; 
} 
} 

//datasetlist = "{id: 1, content: 'ERP', start: '2018'}" 
//window.alert(datasetlist); 

     // 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(datasetlist); 

     // Configuration for the Timeline 
     var options = { 
    height: '500px', 
     start: new Date(2015, 1, 15), 
     end: new Date(2025, 1, 15), 
     timeAxis: {scale: 'year', step: 1} 
    }; 

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

回答

0

Vis需要一组项目作为数据集。像这样,var data = new vis.DataSet([data])其中[data]是一个对象数组。因此,请尝试构建对象并将它们推入数组,然后将其作为数据参数传入。文档可以在这里找到http://visjs.org/docs/data/dataset.html