विज़ुअलाइज़ेशन: लाइन चार्ट (इमेज)

अहम जानकारी: Google के चार्ट टूल के इमेज चार्ट वाले हिस्से को 20 अप्रैल, 2012 से आधिकारिक तौर पर हटा दिया गया था. यह हमारी समर्थन रोकने की नीति के मुताबिक काम करता रहेगा.

खास जानकारी

Google चार्ट API का इस्तेमाल करके एक इमेज के रूप में रेंडर किया जाने वाला लाइन चार्ट.

उदाहरण

<html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load("current", {packages:["imagelinechart"]});
      google.charts.setOnLoadCallback(drawChart);

      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Year', 'Sales', 'Expenses'],
          ['2004',  1000,      400],
          ['2005',  1170,      460],
          ['2006',  660,       1120],
          ['2007',  1030,      540]
        ]);

        var chart = new google.visualization.ImageLineChart(document.getElementById('chart_div'));

        chart.draw(data, {width: 400, height: 240, min: 0});
      }
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 400px; height: 240px;"></div>
  </body>
</html>

लोड हो रहा है

google.charts.load पैकेज का नाम "imagelinechart" है.

  google.charts.load('current', {packages: ['imagelinechart']});

विज़ुअलाइज़ेशन की क्लास का नाम google.visualization.ImageLineChart है.

  var visualization = new google.visualization.ImageLineChart(container);

डेटा फ़ॉर्मैट

पहला स्तंभ एक स्ट्रिंग होना चाहिए और उसमें श्रेणी लेबल होना चाहिए. इसके बाद भी कितने ही कॉलम आ सकते हैं, सभी कॉलम अंकों में होने चाहिए. हर कॉलम को एक अलग लाइन के तौर पर दिखाया जाता है.

कॉन्फ़िगरेशन के विकल्प

नाम टाइप डिफ़ॉल्ट जानकारी
बैकग्राउंड का रंग स्ट्रिंग '#FFFFFF' (सफ़ेद) चार्ट एपीआई कलर फ़ॉर्मैट में चार्ट के लिए बैकग्राउंड का रंग.
कलर श्रेणी<string> ऑटो इसका इस्तेमाल करके, हर डेटा सीरीज़ के लिए खास रंग तय किए जा सकते हैं. कलर को चार्ट एपीआई कलर फ़ॉर्मैट में दिखाया जाता है. रंग i का इस्तेमाल डेटा कॉलम i के लिए किया जाता है, अगर रंगों से ज़्यादा डेटा कॉलम हैं, तो उसे शुरुआती हिस्से में रैप किया जाता है. अगर सभी सीरीज़ के लिए एक ही रंग के वैरिएशन स्वीकार किए जाते हैं, तो color विकल्प का इस्तेमाल करें.
इवेंट चालू करें बूलियन false इससे चार्ट उपयोगकर्ता के ट्रिगर किए गए इवेंट, जैसे कि क्लिक या माउस को फेंकता है. सिर्फ़ कुछ खास तरह के चार्ट के लिए काम करता है. नीचे इवेंट देखें.
ऊंचाई संख्या कंटेनर की ऊंचाई चार्ट की ऊंचाई पिक्सल में.
लेजेंड स्ट्रिंग 'दाएं' लीजेंड की स्थिति और प्रकार. इनमें से कोई एक स्थिति हो सकती है:
  • 'right' - चार्ट के दाईं ओर.
  • 'left' - चार्ट के बाईं ओर.
  • 'ऊपर' - चार्ट के ऊपर.
  • 'सबसे नीचे' - चार्ट के नीचे.
  • 'कोई नहीं' - कोई लेजेंड नहीं दिखाया गया है.
ज़्यादा से ज़्यादा संख्या स्वचालित Y अक्ष में दिखाया जाने वाला ज़्यादा से ज़्यादा मान.
मि संख्या स्वचालित Y ऐक्सिस पर दिखाया जाने वाला कम से कम मान.
AxisLines दिखाएं बूलियन true अगर गलत पर सेट किया जाता है, तो ऐक्सिस लाइनें और लेबल भी हट जाते हैं.
कैटगरी के लेबल दिखाएं बूलियन ShowAxisLines की तरह अगर 'गलत है' पर सेट किया जाता है, तो कैटगरी के लेबल (X अक्ष के लेबल) हटा दिए जाते हैं.
ShowValueLabel बूलियन ShowAxisLines की तरह अगर इसे 'गलत है' पर सेट किया जाता है, तो वैल्यू के लेबल हटा दिए जाते हैं (Y ऐक्सिस लेबल).
शीर्षक स्ट्रिंग कोई शीर्षक नहीं चार्ट के ऊपर दिखाया जाने वाला टेक्स्ट.
valueLabelInterval संख्या ऑटो वह अंतराल जहां वैल्यू ऐक्सिस के लेबल दिखाने हैं. उदाहरण के लिए, अगर min, 0, max 100, और valueLabelsInterval 20 है, तो चार्ट में ऐक्सिस लेबल 0, 20, 40, 60, 80 100 दिखेंगे.
width संख्या कंटेनर की चौड़ाई चार्ट की चौड़ाई पिक्सल में.

तरीके

तरीका रिटर्न टाइप जानकारी
draw(data, options) कोई नहीं चार्ट ड्रॉ करता है.

इवेंट

जेनरिक इमेज चार्ट पेज पर बताए गए इवेंट सुनने के लिए, रजिस्टर किया जा सकता है.

डेटा नीति

कृपया चार्ट एपीआई से जुड़ी नीति पढ़ें.