Jak wykonać wiele wywołań api do wyświetlania pojedynczych danych na wykresie d3

Question

Próbuję wyświetlić dane na wykresie przy użyciu d3, wykonując 2 oddzielne wywołania api z tymi samymi danymi, ale z różnymi datami.

1-te wywołanie 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() }; 

Próbuję dokonać połączenia i wyświetlić wykres w następujący sposób:

Gdzie Linia pogrubiona przedstawia jeden zestaw start and end dates (startDate1 and endDate1) i linia przerywana przedstawia drugi zestaw start and ends dates(startDate2 and endDate2).

próbowałem to:

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); 
    }); 
} 

Jednak to nie działa dla mnie w ogóle ... to po prostu wyświetla informacje tylko jeden danych na wykresie.

EDIT ::::: To co próbowałem z danym ex poniżej: Mam połączenie odpoczynku, która zwraca dane w następującym formacie: wszystkie dane są podobne z wyjątkiem daty ..

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


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

Teraz, gdy próbuję uzyskać dostęp do lineGen(data), zwraca wartość null.

http://jsfiddle.net/nv4x78t6/

i nie widzę wyświetlanych danych ...

Answer 1

mieć dwa zestawy danych i dwie linie. Oznacza to, że chcesz narysować jedną ścieżkę za pomocą data1, a inną ścieżkę do narysowania za pomocą data2.

Oto przykład. Na końcu dołącza tylko drugą svg: ścieżkę do wykresu i rysuje na niej dane2.

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

W twoim przypadku prawdopodobnie chcesz wstępnie wstawić dwie ścieżki, a także dodawać do nich zajęcia takie jak „seriesOneLine” i „seriesTwoLine”. Następnie zawsze narysuj swoją odpowiedź "getData" w "seriesOneLine" i zawsze narysuj "getData2" w "serialTwoLine".

Nie mogę być bardziej konkretny, nie widząc kodu renderującego.

Edit (po aktualizacji zapytania)

Dane skrzypce to dwie serie z jednego punktu danych każdego. Próbujesz narysować wykres liniowy z jednym punktem. Zmieniłem twoje dane na:

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

Pojawiły się dwie linie.