2013-06-11 9 views
6

के साथ शून्य मानों को भरें मैं डी 3 में एक बहु-रेखा चार्ट पर काम कर रहा हूं लेकिन प्रतिपादन के साथ कुछ समस्याएं हैं।0 डी 3 श्रृंखला डेटा

[ 
    { key:"line 1", values: [ {x:1, y:1}, {x:2, y:2} ] }, 
    { key:"line 2" , values: [ {x:1, y:1}, {x:2, y:2}, {x:3, y:3} ] } 
] 

"लाइन 2" ठीक renders, लेकिन "लाइन 1" बंद हो जाता है एक्स = 2. मैं समझता हूँ कि मेरी डाटासेट माना जा सकता है पर प्रतिपादन: मैं डेटा के साथ दो पंक्तियों कि इस तरह दिखता है रेंडर करने के लिए कोशिश कर रहा हूँ अपूर्ण, लेकिन मैं उत्सुक था कि 0 का डिफ़ॉल्ट मान सेट करने का कोई तरीका है जहां x के लिए अंतराल या शून्य मान हैं? विशेष रूप से इस उदाहरण में मैं "लाइन 1" को वाई = 0 प्रदर्शित करना चाहता हूं जहां x = 3।

+0

यह ऐसा कुछ नहीं है जो जेएस करेगा, लेकिन nvd3.js API में इसे सक्षम करने के लिए एक सेटिंग शामिल हो सकती है। कुछ जावास्क्रिप्ट लिखना संभव है जो तीसरे तत्व को सम्मिलित करेंगे, लेकिन मैं पहले सेटिंग के लिए nvd3 एपीआई जांचूंगा। –

+0

(आपने हमें बताया नहीं है कि आप अपनी लाइनों को आकर्षित करने के लिए क्या उपयोग कर रहे हैं)। यदि आप पथ को आकर्षित करने के लिए d3 के 'd3.svg.line()' फ़ंक्शन का उपयोग कर रहे हैं तो निश्चित रूप से सरणी में तत्वों की तुलना में अधिक अंक आकर्षित करने के लिए इसे बताने के लिए कोई अंतर्निहित तरीका नहीं है। इसमें एक 'परिभाषित()' विधि है, जो यहां खेल सकती है, लेकिन आपको पहले से ही उन "अपरिभाषित" तत्वों के साथ अपनी सरणी भरनी होगी। मुझे यह भी संदेह है कि एनवीडी 3 के पास इसे संभालने के लिए कुछ भी है, लेकिन जांच नहीं की है। – meetamit

+1

@AndrewGibson, वर्तमान में मेरे पास शून्य डेटा बिंदु भरने के लिए एक प्रोग्रामिक दृष्टिकोण है, लेकिन आपके द्वारा सुझाए गए डी 3 एपीआई से एक सेटिंग या फ़ंक्शन का उपयोग करने की उम्मीद थी। अभी भी इसे अभी तक नहीं मिला है ... –

उत्तर

2

डी 3 और एनवीडी 3 में ऐसा करने के लिए कोई फ़ंक्शन नहीं है। आपका सबसे अच्छा शर्त आपके गुम मूल्यों को सम्मिलित करना है। कुछ कॉफीस्क्रिप्ट जो कुछ अंडरस्कोर उपयोगिताओं का उपयोग करती हैं, लेकिन डी 3 में बहुत से फ़ंक्शन थे, इसलिए यदि आपको इसकी आवश्यकता नहीं है तो आपको अनिवार्य रूप से अंडरस्कोर पर निर्भर रहने की आवश्यकता नहीं है। सबसे पहले आपको डोमेन मानों की सूची मिलती है, फिर आप अपना गुम मूल्य डालते हैं।

विधि getDomainValues ​​ डेटा और आयाम (एक कुंजी) लेता है और डोमेन मानों का सेट प्राप्त करने के लिए सभी मान खींचता है। आप की तरह डेटा था, तो:

key : a 
    values : [ {x: 4, y:1}, {x: 5, y:1}, {x: 7, y:1} ] 
    key : b 
    values : [ {x: 1, y:10}, {x: 2, y:5}, {x: 3, y:0} ] 

यह वापसी होगी:

[1,2,3,4,5,7] 


getDomainValues = (data, dimension) -> 
_.uniq _.flatten _.map data, (item) -> _.pluck(item.values, dimension) 

आयाम के लिए विधि insertValues ​​ आवेषण मूलभूत मूल्यों (सबसे अधिक 0) मान सरणी में मौजूद नहीं है। यह आयाम से टाइप करता है। आप की तरह डेटा था, तो: क्या आप

key : a 
    values : [ {x: 4, y:1}, {x: 2, y:1}, {x: 1, y:1} ] 

और एक डोमेन [0, 1,2,3,4,5] और -10 के एक मूल्य की आपूर्ति मिल चाहते हैं:

key : a 
    values : [ {x: 0, y:-10}, {x: 1, y:1}, {x: 2, y:1}, {x: 3, y:-10}, {x: 4, y:1}, {x: 5, y: -10}] 


insertValues = (data, value, dimension, metric, domain)->  
defaults = {} 
for item in domain 
    v = {} 
    v[dimension] = item 
    v[metric] = value 
    defaults[item] = v 

_.each data, (item) -> 
    vals = _.groupBy(item.values, (i) -> i[dimension]) 
    vals = _.flatten _.values _.defaults vals, defaults 
    vals = _.sortBy vals, dimension 
    item.values = vals 
data 

तो तुम इस तरह से उन्हें कॉल कर सकते हैं:

data = [ 
    { key:"line 1", values: [ {x:1, y:1}, {x:2, y:2} ] }, 
    { key:"line 2" , values: [ {x:1, y:1}, {x:2, y:2}, {x:3, y:3} ] } 
] 

domain = getDomainValues data, 'x' 
filledData = insertValues data, 0, 'x', 'y', domain 

इसे जावास्क्रिप्ट में देखें: https://gist.github.com/FaKod/e6724675e4ebaf9f8fa4

+1

"संकलित" सम्मिलित करें (...) जावास्क्रिप्ट में: https://gist.github.com/FaKod/e6724675e4ebaf9f8fa4 – Christopher