Chart.js v2 डेटासेट लेबल छिपाते हैं

Question

चार्ट.जेएस v2.1.3 का उपयोग करके एक ग्राफ बनाने के लिए मेरे पास निम्नलिखित कोड हैं:

var ctx = $('#gold_chart');
var goldChart = new Chart(ctx, {
    type: 'line',
    data: {
        labels: dates,
        datasets: [{
            label: 'I want to remove this Label',
            data: prices,
            pointRadius: 0,
            borderWidth: 1
        }]
    }
});

कोड सरल लगते हैं, लेकिन मैं ग्राफ़ से लेबल को नहीं हटा सकता। मैंने बहुत सारे समाधानों की कोशिश की, जो मुझे ऑनलाइन मिले, लेकिन उनमें से ज्यादातर चार्ट.जेएस v1.x का उपयोग करते हैं।

मैं डेटासेट लेबल कैसे निकाल सकता हूं?

Answer 1

बस labelऔर tooltipजैसे विकल्प सेट करें

...
options: {
    legend: {
        display: false
    },
    tooltips: {
        callbacks: {
           label: function(tooltipItem) {
                  return tooltipItem.yLabel;
           }
        }
    }
}

---

फिडल - http://jsfiddle.net/g19220r6/

Comments

आकर्षण की तरह काम करता है, धन्यवाद। वैसे, लाइन चार्ट के ग्रेडिएंट कलर को कैसे बदलें?

— रैप्टर

आपका मतलब है, बॉर्डर / बैकग्राउंडर बॉर्डर के रूप में एक ग्रेडिएंट का उपयोग कैसे करें। बस संदर्भ पर एक बनाएँ और उपयोग करें कि जब इनिशियलाइज़ करना - jsfiddle.net/g9h6gtvx

— potatopeelings

क्या होगा अगर मैं इसे एक डेटासेट पर उपयोग करना चाहता हूं, लेकिन दूसरे पर नहीं

— निक अलेक्जेंडर

यह काम करता हैं! सिर्फ एक सवाल, आपको ये सभी विकल्प कहां मिले?

— fangzhzh

Answer 2

जोड़ें:

Chart.defaults.global.legend.display = false;

आपके स्क्रिप्ट कोड की शुरुआत में;

Comments

सरल और पूरी तरह से काम करता है। मैंने देखा कि स्वीकृत उत्तर कुछ चीजों को तोड़ रहा था।

— स्टिकोडोडोरेंट

Answer 3

आप "शीर्षक" को हटाकर टूलटिप को एक पंक्ति में रख सकते हैं:

this.chart = new Chart(ctx, {
    type: this.props.horizontal ? 'horizontalBar' : 'bar',
    options: {
        legend: {
            display: false,
        },
        tooltips: {
            callbacks: {
                label: tooltipItem => `${tooltipItem.yLabel}: ${tooltipItem.xLabel}`, 
                title: () => null,
            }
        },
    },
});

Answer 4

इसे जोड़ना इतना ही सरल है: legend: { display: false, }

// या यदि आप चाहते हैं कि आप इस अन्य विकल्प का उपयोग कर सकें जो काम भी करे:

Chart.defaults.global.legend.display = false;

Comments

सरल जवाब, पहिया को सुदृढ़ करने की कोई आवश्यकता नहीं है।

— टीएनटी

विकल्प: {किंवदंती: {प्रदर्शन: असत्य,}} यह लिखने में मदद करता है कि इसे किस ब्लॉक में डाला जाए (यह मूल रूप से प्रलेखन के साथ समस्या है)

— नॉर्माजियन

Answer 5

new Chart('idName', {
      type: 'typeChar',
      data: data,
      options: {
        legend: {
          display: false
        }
      }
    });

Comments

नमस्ते, एसओ में आपका स्वागत है। कोड के बगल में एक संक्षिप्त विवरण जोड़ने पर विचार करें

— बोर्डर