javascript - 如何进行多个api调用以在d3图表中显示单个数据

我试图通过使用具有相同数据但日期不同的2个单独的api调用，在使用d3的图表中显示数据。

第1次api调用:

 var data1 = {     'name'     : 'test',
                   'id'       : 7948237982937,
                   'startDate': startDate1,
                   'endDate':   endDate1,
                   'tz':        getTimezoneOffset() };


var data2: {        'name'     : 'test',
                   'id'       : 7948237982937,
                   'startDate': startDate2,
                   'endDate':   endDate2,
                   'tz':        getTimezoneOffset() };

我正在尝试拨打电话并显示如下图:

其中粗线代表一组start and end dates (startDate1 and endDate1)，虚线代表第二组start and ends dates(startDate2 and endDate2)。

我尝试了这个:

draw: function(){
   getData();
   getData2();
},
getData: function() {
    var self = this;
    self.showLoading();
    $.get('url', data1, function(response) {
       console.log("success" + response);
    });
},
 getData2: function() {
    var self = this;
    self.showLoading();
    $.get('url', data2, function(response) {
       console.log("success" + response);
    });
}

但是，这对我根本不起作用...它仅在图形中显示一个数据信息。

编辑:::::
这就是我在给定的ex之前尝试过的方法:我有rest调用，它以这种格式返回数据:除日期外，所有数据都是相似的。

data: //returns
  Object {sale: "202", year: "2000", date: "12"}


data2: //returns
 Object {sale: "202", year: "2000", date: "24"}

现在，当我尝试访问lineGen(data)时，它返回null。

http://jsfiddle.net/nv4x78t6/

我没有显示任何数据...

最佳答案

您有两个数据集和两行。这意味着您希望使用data1绘制一条路径，而使用data2绘制另一条路径。

这是一个例子。最后，他只是向图表追加了第二个svg:path并在其上绘制了data2。

http://code.tutsplus.com/tutorials/building-a-multi-line-chart-using-d3js--cms-22935

在您的情况下，您可能想要预插入两个路径，并向其添加类，例如“seriesOneLine”和“seriesTwoLine”。然后，始终将“getData”响应绘制到“seriesOneLine”中，并始终将“getData2”绘制到“seriesTwoLine”中。

如果没有看到您的一些渲染代码，我真的不能说得更具体。

编辑(问题更新后)

您的提琴数据是两个系列，每个系列都有一个数据点。您正在尝试绘制单点折线图。我将您的数据更改为此:

                var data = [{
                    "sale": "202",
                    "year": "2000",
                },{
                    "sale": "200",
                    "year": "2001"
                }];
                var data2 = [{
                    "sale": "202",
                    "year": "2000",
                }, {
                    "sale": "140",
                    "year": "2001"
                }];

并且出现了两行。

关于javascript - 如何进行多个api调用以在d3图表中显示单个数据，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/30470691/