nvd3

2013-06-26 14 views
5

में संचयी लाइन चार्ट पर कस्टम टूलटिप जब मैं संचयी रेखा चार्ट पर लाइनों पर होवर करता हूं तो मुझे कुछ y समय पर टूलटिप संदेश x मान मिलता है। मैं इस संदेश को संपादित करना और अधिक सामग्री जोड़ना चाहता हूं।nvd3

मेरे मूल्य सरणी में से मेरे पास जेसन है जिसमें {एक्स: एक्स, वाई: वाई, जेड: जेड, डीटी: डेट} मैं एक कस्टम संदेश सूची एक्स/वाई/जेड को आज तक दिखाना चाहता हूं।

+0

आप इसे [cumulativeLineChart.js] (https://github.com/novus/nvd3/blob/master/src/models/cumulativeLineChart.js#L25) में संपादित करने का प्रयास कर सकते हैं। आपको ** लाइन 25 ** में स्ट्रिंग जोड़ें। सबसे अच्छा तरीका नहीं हो सकता है, लेकिन आपकी समस्या का समाधान हो सकता है। – shabeer90

उत्तर

2

आपने अभी तक कोई उचित समाधान नहीं मिला है, तो यहां आप इस कोशिश -

nv.addGraph(function() { 
    var chart = nv.models.cumulativeLineChart().x(function(d) { 
     return d[0] 
    }).y(function(d) { 
     return d[1] 
    }).color(d3.scale.category10().range()).tooltip(function(key, x, y, e, graph) { 
     return '<h3>' + key + ' Custom Text Here ' + x + '</h3> here' + '<p> or here ,' + y + '</p>' 
    }); 
}); 

आशा है कि यह मदद करता है।

+2

बढ़िया, यह मेरे लिए पूरी तरह से काम किया। बस थोड़ी सी जानकारी जोड़ने के लिए, प्रत्येक डेटा नोड के लिए अतिरिक्त डेटा 'ई' पैरामीटर के माध्यम से पहुंचा जा सकता है, e.point.Z को ज़ेड का मान मिलेगा। – Andrei

6

मैं nvd3 veraion 1.1.15b का उपयोग कर रहा हूं।

कॉलिंग .tooltip() मेरे लिए काम नहीं किया था, लेकिन .tooltipContent() बुला था, निम्नलिखित कोड में के रूप में: ऊपर बाहर

 var chart = nv.models.pieChart() 
      .x(function (d) { return d.file; }) 
      .y(function (d) { return d.size; }) 
      .tooltipContent(function (key, y, e, graph) { 
       return '<h3>' + key + '</h3>' + 
        '<p>' + e.value.toSizeFmt() + '</p>'; 
      }) 

Andrei के रूप में अंक, e पैरामीटर ताकि आप स्वरूपित कर सकते हैं कच्चे मूल्यों तक पहुँच प्रदान करता उन्हें y के साथ काम करने के बजाय जो पहले से ही स्वरूपित पाठ है। उम्मीद है की यह मदद करेगा!

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