2015-05-26 10 views
6

में एक ही डेटा प्रदर्शित करने के लिए एकाधिक एपीआई कॉल कैसे करें, मैं उसी डेटा के साथ 2 अलग एपीआई कॉल करके अलग-अलग तिथियों के साथ डी 3 का उपयोग करके चार्ट में डेटा प्रदर्शित करने का प्रयास कर रहा हूं।डी 3 चार्ट

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

हालांकि यह मेरे लिए बिल्कुल काम नहीं करता है ... यह सिर्फ ग्राफ में केवल एक ही डेटा की जानकारी प्रदर्शित करता है:

मैं इस कोशिश की। मैं बाकी कॉल कि इस स्वरूप में डेटा देता है:

संपादित करें ::::: यह मैं क्या नीचे दी गई पूर्व से करने की कोशिश की है सभी डेटा तारीख के अलावा समान है ..

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


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

अब जब मैंने lineGen(data) तक पहुंचने का प्रयास किया, तो यह शून्य हो जाता है।

http://jsfiddle.net/nv4x78t6/

और मैं कोई डेटा दिखाई ...

+0

मुझे नहीं पता कि आपके कोड में चार्ट कहां प्रदर्शित होता है। क्या आपके कंसोल स्टेटमेंट्स तिथियों के दो अलग-अलग सेट दिखाते हैं? – Sigfried

+0

आपको लाइन बनाने के लिए 2 अंक चाहिए! http://jsfiddle.net/nv4x78t6/3/ –

उत्तर

1

आप दो डेटा सेट और दो पंक्तियों की है। इसका मतलब है कि आप डेटा 1 का उपयोग करके एक पथ खींचा जाना चाहते हैं, और डेटा 2 का उपयोग करके खींचा जाने वाला दूसरा पथ।

यहां एक उदाहरण है। अंत में, वह सिर्फ एक दूसरा svg जोड़ता है: चार्ट के पथ और उस पर डेटा 2 खींचता है।

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

आपके मामले में आप शायद दो रास्ते पूर्व डालें, और "seriesOneLine" और "seriesTwoLine" की तरह उन्हें कक्षाओं जोड़ना चाहते हैं। फिर हमेशा "सीरीज़ऑनलाइन" में अपनी "गेटडाटा" प्रतिक्रिया खींचें, और हमेशा "getData2" को "seriesTwoLine" में खींचें।

मैं आपके कुछ प्रतिपादन कोड को देखे बिना वास्तव में अधिक विशिष्ट नहीं हो सकता।

संपादित करें (प्रश्न अपडेट के बाद)

आपका बेला डेटा एक डेटा बिंदु प्रत्येक के साथ दो श्रृंखला है। आप एक बिंदु के साथ एक रेखा चार्ट खींचने की कोशिश कर रहे हैं। मैंने आपका डेटा इस पर बदल दिया:

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

और दो पंक्तियां दिखाई गईं।

संबंधित मुद्दे