अक्ष और ग्रिडलाइंस हाईचर्ट छिपाएँ

Question

मैं अपने Highcharts चार्ट की धुरी और ग्रिडलाइन्स को पूरी तरह से छिपाने की कोशिश कर रहा हूं। अब तक मैंने लाइनों की चौड़ाई 0 पर सेट करने की कोशिश की है, लेकिन यह काम नहीं किया।

xAxis: {
  lineWidth: 0,
  minorGridLineWidth: 0,
  lineColor: 'transparent'
}

क्या "सादे" प्लॉट बनाने के लिए धुरी रेखाओं / टिक्स और ग्रिडलाइन को केवल वैश्विक रूप से अक्षम करना संभव है?

Comments

यहाँ बताया गया है कि yAxis

— Dan Dascalescu

Answer 1

बस जोड़ दो

xAxis: {
   ...  
   lineWidth: 0,
   minorGridLineWidth: 0,
   lineColor: 'transparent',
   ...          
   labels: {
       enabled: false
   },
   minorTickLength: 0,
   tickLength: 0
}

xAxis परिभाषा के लिए।

संस्करण 4.1.9 के बाद से आप बस अक्ष विशेषता का उपयोग कर सकते हैं visible:

xAxis: {
    visible: false,
}

Comments

@dgw यह एक्स-अक्ष को पारदर्शी बनाता है, लेकिन यह अभी भी डेटा के तहत भौतिक स्थान पर है। क्या इसे 0 ऊंचाई देने का कोई तरीका है?

— ट्रेवर बर्नहैम

वह थोड़ा ओवरकिल है। हाईचर्स को "दृश्यमान" नामक एक साधारण संपत्ति को लागू करना चाहिए जो एक अक्ष प्रदर्शित किया जाता है या नहीं। मैंने इसे एक सुविधा अनुरोध के रूप में पोस्ट किया है और आप इसे यहां वोट कर सकते हैं ।

— दान डस्केलस्क्यू

minorGridLineWidthअस्पष्ट संपत्ति थी जिसकी मुझे तलाश थी। धन्यवाद!

— जेटकॉम

@TrevorBurnham - टिकमार्क वाले भौतिक स्थान को निकालने के लिए, आपको चार्ट सेट करना होगा। स्पेसिंग = [०, ०, ०, ०] (या बस जो भी अक्ष सेट करें, जैसे चार्ट। स्पेस लेस, शून्य तक, यदि आप नहीं चाहते हैं। सभी रिक्ति को खत्म करने के लिए)। इस सवाल के लिए मेरे लिए यह गायब था।

— मैथ्यू डीन

tickLength: 0मुझे लग रहा था कि मुझे अपने लाइन चार्ट पर टिक के निशान छिपाने की जरूरत है।

— हार्टले ब्रॉडी

Answer 2

इसके लिए yAxisआपको आवश्यकता होगी:

gridLineColor: 'transparent',

Comments

क्या आपको भी सेट करने की आवश्यकता title.textहै null? वैसे भी, HighCharts को केवल "दृश्यमान" नामक एक साधारण संपत्ति को लागू करना चाहिए जो एक अक्ष प्रदर्शित होने या न होने के लिए टॉगल करेगा। मैंने इसे एक सुविधा अनुरोध के रूप में पोस्ट किया है और आप यहां इसके लिए मतदान कर सकते हैं ।

— दान डस्केलस्क्यू

यदि आप अभी भी अन्य कुल्हाड़ियों को हटाने के लिए ग्रिड लाइनों को समय से पहले हटाने की सेटिंग gridLineColorकर transparentसकते हैं। इस उदाहरण को देखें ।

— Dan Dascalescu

Answer 3

यदि आपके पास Highcharts के v4.9 से बड़ा संस्करण है, तो आप और visible: falseमें उपयोग कर सकते हैंxAxisyAxis सेटिंग सेटिंग ।

उदाहरण:

$('#container').highcharts({

    chart: {
        type: 'column'
    },

    title: {
        text: 'Highcharts axis visibility'
    },

    xAxis: {
        visible: false
    },

    yAxis: {
        title: {
            text: 'Fruit'
        },
        visible: false
    }

});

Comments

यह सबसे अच्छा जवाब है

— micapam

Answer 4

आप yAxis पर भी ग्रिडलाइन छिपा सकते हैं:

yAxis:{ 
  gridLineWidth: 0,
  minorGridLineWidth: 0
}

Answer 5

मैं बस के साथ मेरा बंद करने में कामयाब रहे

       lineColor: 'transparent',
       tickLength: 0

Answer 6

यदि आप config ऑब्जेक्ट को स्पर्श नहीं करना चाहते हैं, तो आप बस css द्वारा ग्रिड छिपाते हैं:

.chart-container .highcharts-grid {
   display: none;
}

Answer 7

इसने हमेशा मेरे लिए अच्छा काम किया है:

yAxes: [{
         ticks: {
                 display: false;
                },