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

खास जानकारी

कॉलम चार्ट एक वर्टिकल बार चार्ट होता है, जिसे उपयोगकर्ता ने ब्राउज़र के लिए इस्तेमाल किया जाने पर, SVG या VML में से किसी का भी इस्तेमाल किया हो. उपयोगकर्ता के डेटा पर कर्सर घुमाने पर, सभी Google चार्ट की तरह कॉलम चार्ट में टूलटिप दिखती हैं. चार्ट के हॉरिज़ॉन्टल वर्शन के लिए, बार चार्ट देखें.

उदाहरण

कॉलम में रंग भरना

आइए, चार कीमती धातुओं की सघनता का चार्ट बनाएं:

ऊपर, सभी रंग डिफ़ॉल्ट नीले हैं. ऐसा इसलिए, क्योंकि वे सभी एक ही सीरीज़ का हिस्सा हैं. अगर कोई दूसरी सीरीज़ मौजूद होती, तो वह लाल रंग की होती. इन रंगों को अपनी पसंद के मुताबिक बनाया जा सकता है. इसके लिए, स्टाइल की भूमिका का इस्तेमाल करें:

कलर चुनने के तीन अलग-अलग तरीके हैं. साथ ही, हमारी डेटा टेबल में उन सभी को दिखाया जाता है: आरजीबी वैल्यू, अंग्रेज़ी के रंग का नाम, और सीएसएस जैसे एलान का फ़ॉर्मैट: 

       var data = google.visualization.arrayToDataTable([
         ['Element', 'Density', { role: 'style' }],
         ['Copper', 8.94, '#b87333'],            // RGB value
         ['Silver', 10.49, 'silver'],            // English color name
         ['Gold', 19.30, 'gold'],

       ['Platinum', 21.45, 'color: #e5e4e2' ], // CSS-style declaration
      ]);

कॉलम के स्टाइल

स्टाइल की भूमिका, सीएसएस जैसे निर्देशों की मदद से, कॉलम के दिखने के कई पहलुओं को कंट्रोल करने में मदद करती है:

  • color
  • opacity
  • fill-color
  • fill-opacity
  • stroke-color
  • stroke-opacity
  • stroke-width

हम यह सुझाव नहीं देते कि आप चार्ट में अलग-अलग स्टाइल इस्तेमाल करें. स्टाइल चुनें और उसके हिसाब से काम करें. हालांकि, स्टाइल के सभी एट्रिब्यूट दिखाने के लिए, यहां एक सैंपलर दिया गया है:

पहले दो कॉलम एक खास color का इस्तेमाल करते हैं (पहला, अंग्रेज़ी नाम के साथ, दूसरा आरजीबी वैल्यू वाला). कोई भी opacity नहीं चुना गया है, इसलिए 1.0 (पूरी तरह से अपारदर्शी) का डिफ़ॉल्ट इस्तेमाल किया गया है. यही वजह है कि दूसरे कॉलम इसके पीछे की ग्रिडलाइन को छिपा देता है. तीसरे कॉलम में, 0.2 के opacity का इस्तेमाल किया जाता है. इससे, ग्रिडलाइन के बारे में पता चलता है. चौथे स्टाइल में, स्टाइल बनाने के लिए तीन एट्रिब्यूट का इस्तेमाल किया जाता है: बॉर्डर को बनाने के लिए stroke-color और stroke-width, जबकि अंदर मौजूद रेक्टैंगल का रंग बताने के लिए, fill-color एट्रिब्यूट इस्तेमाल किए जाते हैं. सबसे दाईं ओर वाला कॉलम, बॉर्डर और अपारदर्शिता को चुनने और उन्हें भरने के लिए, stroke-opacity और fill-opacity का इस्तेमाल भी करता है: 

   function drawChart() {
      var data = google.visualization.arrayToDataTable([
        ['Year', 'Visitations', { role: 'style' } ],
        ['2010', 10, 'color: gray'],
        ['2020', 14, 'color: #76A7FA'],
        ['2030', 16, 'opacity: 0.2'],
        ['2040', 22, 'stroke-color: #703593; stroke-width: 4; fill-color: #C5A5CF'],
        ['2050', 28, 'stroke-color: #871B47; stroke-opacity: 0.6; stroke-width: 8; fill-color: #BC5679; fill-opacity: 0.2']
      ]);

कॉलम लेबल करना

चार्ट में कई तरह के लेबल होते हैं, जैसे कि टिक लेबल, लेजेंड के लेबल, और टूलटिप में लेबल. इस सेक्शन में, हम देखेंगे कि कॉलम चार्ट में कॉलम को अंदर (या पास) कैसे रखते हैं.

मान लें कि हम हर कॉलम में, सही रासायनिक चिह्न जोड़ना चाहते हैं. हम एनोटेशन की भूमिका के साथ ऐसा कर सकते हैं:

हमारी डेटा टेबल में, हमने अपने कॉलम लेबल रखने के लिए { role: 'annotation' } के साथ एक नया कॉलम तय किया है: 

       var data = google.visualization.arrayToDataTable([
         ['Element', 'Density', { role: 'style' }, { role: 'annotation' } ],
         ['Copper', 8.94, '#b87333', 'Cu' ],
         ['Silver', 10.49, 'silver', 'Ag' ],
         ['Gold', 19.30, 'gold', 'Au' ],
         ['Platinum', 21.45, 'color: #e5e4e2', 'Pt' ]
      ]);

डेटा की जानकारी देखने के लिए, उपयोगकर्ता कॉलम पर कर्सर घुमा सकते हैं, लेकिन हो सकता है कि आप उन्हें खुद कॉलम में शामिल करना चाहें.

इसे समझना थोड़ा मुश्किल है, क्योंकि हम हर कॉलम के लिए एनोटेशन तय करने के लिए, एक DataView बनाते हैं. 

  <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
  <script type="text/javascript">
    google.charts.load("current", {packages:['corechart']});
    google.charts.setOnLoadCallback(drawChart);
    function drawChart() {
      var data = google.visualization.arrayToDataTable([
        ["Element", "Density", { role: "style" } ],
        ["Copper", 8.94, "#b87333"],
        ["Silver", 10.49, "silver"],
        ["Gold", 19.30, "gold"],
        ["Platinum", 21.45, "color: #e5e4e2"]
      ]);

      var view = new google.visualization.DataView(data);
      view.setColumns([0, 1,
                       { calc: "stringify",
                         sourceColumn: 1,
                         type: "string",
                         role: "annotation" },
                       2]);

      var options = {
        title: "Density of Precious Metals, in g/cm^3",
        width: 600,
        height: 400,
        bar: {groupWidth: "95%"},
        legend: { position: "none" },
      };
      var chart = new google.visualization.ColumnChart(document.getElementById("columnchart_values"));
      chart.draw(view, options);
  }
  </script>
<div id="columnchart_values" style="width: 900px; height: 300px;"></div>

अगर हम वैल्यू को अलग-अलग फ़ॉर्मैट में बनाना चाहें, तो हम एक फ़ॉर्मैट तय कर सकते हैं और उसे इस तरह से किसी फ़ंक्शन में रैप कर सकते हैं: 

      function getValueAt(column, dataTable, row) {
        return dataTable.getFormattedValue(row, column);
      }

फिर हम इसे calc: getValueAt.bind(undefined, 1) नाम से कॉल कर पाएंगे.

अगर लेबल पूरी तरह से कॉलम में फ़िट होने के लिए बहुत बड़ा है, तो यह बाहर दिखता है:

स्टैक किए गए कॉलम चार्ट

स्टैक किया गया कॉलम चार्ट एक कॉलम चार्ट होता है, जिसमें मिलते-जुलते मान एक-दूसरे के ऊपर रखे जाते हैं. अगर कोई नेगेटिव वैल्यू है, तो उसे चार्ट के बेसलाइन के नीचे, उलटे क्रम में स्टैक किया जाता है. आम तौर पर, इसका इस्तेमाल तब किया जाता है, जब कोई कैटगरी आम तौर पर कॉम्पोनेंट में बंटती है. उदाहरण के लिए, कुछ काल्पनिक किताबों की बिक्री पर विचार करें, जो शैली के आधार पर बांटी गई हों और समय के साथ उनकी तुलना की जाए:

isStacked विकल्प को true पर सेट करके, स्टैक किए गए कॉलम चार्ट बनाए जा सकते हैं: 

      var data = google.visualization.arrayToDataTable([
        ['Genre', 'Fantasy & Sci Fi', 'Romance', 'Mystery/Crime', 'General',
         'Western', 'Literature', { role: 'annotation' } ],
        ['2010', 10, 24, 20, 32, 18, 5, ''],
        ['2020', 16, 22, 23, 30, 16, 9, ''],
        ['2030', 28, 19, 29, 30, 12, 13, '']
      ]);

      var options = {
        width: 600,
        height: 400,
        legend: { position: 'top', maxLines: 3 },
        bar: { groupWidth: '75%' },
        isStacked: true,
      };

स्टैक किए गए कॉलम चार्ट में, 100% स्टैकिंग भी इस्तेमाल की जा सकती है. इसमें, हर डोमेन वैल्यू पर एलिमेंट के स्टैक को फिर से स्केल किया जाता है, ताकि वे 100% तक जुड़ जाएं. इसके लिए isStacked: 'percent' का इस्तेमाल किया जा सकता है, जो हर वैल्यू को 100% के फ़ॉर्मैट में फ़ॉर्मैट करता है. वहीं, isStacked: 'relative' में हर वैल्यू को 1 के हिस्से के तौर पर फ़ॉर्मैट किया जाता है. isStacked: 'absolute' का विकल्प भी है, जो isStacked: true की तरह काम करता है.

ध्यान दें कि दाईं ओर दिए गए 100% स्टैक किए गए चार्ट में टिक वैल्यू, 0-1 के पैमाने पर 1 के अंश के आधार पर होती हैं. हालांकि, ऐक्सिस की वैल्यू प्रतिशत के रूप में दिखाई जाती हैं. इसकी वजह यह है कि प्रतिशत ऐक्सिस के टिक से मिलते-जुलते 0-1 स्केल वैल्यू पर "#.##%" फ़ॉर्मैट लागू होता है. isStacked: 'percent' का इस्तेमाल करते समय, सही 0-1 स्केल का इस्तेमाल करके सभी टिक/ऐक्सिस की वैल्यू ज़रूर बताएं.

स्टैक किया गया
        var options_stacked = {
          isStacked: true,
          height: 300,
          legend: {position: 'top', maxLines: 3},
          vAxis: {minValue: 0}
        };
100% स्टैक किया गया
        var options_fullStacked = {
          isStacked: 'percent',
          height: 300,
          legend: {position: 'top', maxLines: 3},
          vAxis: {
            minValue: 0,
            ticks: [0, .3, .6, .9, 1]
          }
        };

सामग्री कॉलम चार्ट बनाना

साल 2014 में, हमने Google के प्लैटफ़ॉर्म पर चलने वाली अपनी प्रॉपर्टी और ऐप्लिकेशन (जैसे कि Android ऐप्लिकेशन) पर सामान्य माहौल और रंग-रूप देने के लिए दिशा-निर्देशों का एलान किया. इसे हम मटीरियल डिज़ाइन कहते हैं. हम अपने सभी मुख्य चार्ट के "सामग्री" वर्शन उपलब्ध कराएंगे; अगर आप चाहें तो उनका इस्तेमाल कर सकते हैं.

मटीरियल कॉलम चार्ट बनाने का काम, "क्लासिक" कॉलम चार्ट बनाना है. आप Google विज़ुअलाइज़ेशन एपीआई लोड करते हैं (हालांकि, 'corechart' पैकेज के बजाय 'bar' पैकेज के साथ), अपनी डेटा टेबल तय करते हैं. इसके बाद, एक ऑब्जेक्ट बनाते हैं (लेकिन google.visualization.ColumnChart के बजाय क्लास google.charts.Bar).

बार चार्ट और कॉलम चार्ट बिलकुल एक जैसे होते हैं, लेकिन ओरिएंटेशन के लिए हम मटीरियल बार चार्ट, दोनों को कॉल करते हैं. भले ही, बार वर्टिकल हों (आम तौर पर, कॉलम चार्ट होते हैं) या हॉरिज़ॉन्टल होते हैं (बार चार्ट). मटीरियल में अंतर सिर्फ़ bars विकल्प में है. 'horizontal' पर सेट होने पर, ओरिएंटेशन परंपरागत क्लासिक बार चार्ट की तरह दिखेगा; नहीं तो बार वर्टिकल होंगे.

ध्यान दें: मटीरियल चार्ट, Internet Explorer के पुराने वर्शन में काम नहीं करेंगे. (IE8 और पुराने वर्शन में SVG काम नहीं करते. ये मटीरियल चार्ट ज़रूरी हैं.)

मटीरियल कॉलम चार्ट में, क्लासिक कॉलम के चार्ट में कई छोटे-छोटे सुधार होते हैं, जैसे कि एक बेहतर रंग पटल, गोलाकार कोने, ज़्यादा साफ़ लेबल लेबल, सीरीज़ के बीच ज़्यादा दूरी, सॉफ़्ट ग्रिडलाइन, और शीर्षक (और सबटाइटल जोड़ना).

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

      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Year', 'Sales', 'Expenses', 'Profit'],
          ['2014', 1000, 400, 200],
          ['2015', 1170, 460, 250],
          ['2016', 660, 1120, 300],
          ['2017', 1030, 540, 350]
        ]);

        var options = {
          chart: {
            title: 'Company Performance',
            subtitle: 'Sales, Expenses, and Profit: 2014-2017',
          }
        };

        var chart = new google.charts.Bar(document.getElementById('columnchart_material'));

        chart.draw(data, google.charts.Bar.convertOptions(options));
      }
    </script>
  </head>
  <body>
    <div id="columnchart_material" style="width: 800px; height: 500px;"></div>
  </body>
</html>

मटीरियल चार्ट बीटा वर्शन में हैं. खोज नतीजों में दिखने और इंटरैक्ट करने के तरीके काफ़ी हद तक तय होते हैं, लेकिन क्लासिक चार्ट में मौजूद विकल्पों में से कई अब तक उपलब्ध नहीं हैं. उन विकल्पों की सूची यहां देखी जा सकती है जो अब तक इस समस्या में काम नहीं करते हैं.

साथ ही, यह तय करने का तरीका भी तय नहीं होता कि विकल्पों को कैसे तय किया जाता है. इसलिए, अगर आप क्लासिक विकल्पों में से किसी का भी इस्तेमाल कर रहे हैं, तो इस लाइन को बदलकर अपनी सामग्री के विकल्पों में बदलाव करें:

chart.draw(data, options);

...इसके साथ:

chart.draw(data, google.charts.Bar.convertOptions(options));

google.charts.Bar.convertOptions() का इस्तेमाल करने से, hAxis/vAxis.format के प्रीसेट विकल्पों जैसी कुछ सुविधाओं का फ़ायदा लिया जा सकता है.

ड्यूअल-Y चार्ट

कभी-कभी आप दो चार्ट को दो अलग-अलग Y-ऐक्सिस के साथ कॉलम चार्ट में दिखाना चाहते हैं: एक सीरीज़ के लिए बाईं ओर ऐक्सिस और दूसरी के लिए राइट ऐक्सिस:

ध्यान दें कि हमारे दो y-ऐक्सिस पर सिर्फ़ अलग-अलग लेबल लगाए गए हैं (""parsecs" बनाम "साफ़ तौर पर तीव्रता"), लेकिन उनमें से हर एक का अपना अलग स्केल और ग्रिडलाइन है. अगर आप इस व्यवहार को कस्टमाइज़ करना चाहते हैं, तो vAxis.gridlines विकल्पों का उपयोग करें.

नीचे दिए गए कोड में, axes और series विकल्पों से एक साथ चार्ट के डुअल-Y लुक के बारे में पता चलता है. series विकल्प से पता चलता है कि हर ऐक्सिस के लिए कौनसा ऐक्सिस इस्तेमाल करना है ('distance' और 'brightness'; इनका डेटा टेबल में दिए गए कॉलम के नामों से कोई संबंध नहीं है). axes विकल्प, इस चार्ट को एक डुअल-Y चार्ट बनाता है. इसमें 'distance' ऐक्सिस को बाईं ओर ("parsecs" लेबल के साथ) और 'brightness' ऐक्सिस को दाईं ओर दिखाया जाता है (इसे "साफ़ तौर पर दिया गया प्रतिशत" के तौर पर लेबल किया जाता है). 

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

      function drawStuff() {

        var button = document.getElementById('change-chart');
        var chartDiv = document.getElementById('chart_div');

        var data = google.visualization.arrayToDataTable([
          ['Galaxy', 'Distance', 'Brightness'],
          ['Canis Major Dwarf', 8000, 23.3],
          ['Sagittarius Dwarf', 24000, 4.5],
          ['Ursa Major II Dwarf', 30000, 14.3],
          ['Lg. Magellanic Cloud', 50000, 0.9],
          ['Bootes I', 60000, 13.1]
        ]);

        var materialOptions = {
          width: 900,
          chart: {
            title: 'Nearby galaxies',
            subtitle: 'distance on the left, brightness on the right'
          },
          series: {
            0: { axis: 'distance' }, // Bind series 0 to an axis named 'distance'.
            1: { axis: 'brightness' } // Bind series 1 to an axis named 'brightness'.
          },
          axes: {
            y: {
              distance: {label: 'parsecs'}, // Left y-axis.
              brightness: {side: 'right', label: 'apparent magnitude'} // Right y-axis.
            }
          }
        };

        var classicOptions = {
          width: 900,
          series: {
            0: {targetAxisIndex: 0},
            1: {targetAxisIndex: 1}
          },
          title: 'Nearby galaxies - distance on the left, brightness on the right',
          vAxes: {
            // Adds titles to each axis.
            0: {title: 'parsecs'},
            1: {title: 'apparent magnitude'}
          }
        };

        function drawMaterialChart() {
          var materialChart = new google.charts.Bar(chartDiv);
          materialChart.draw(data, google.charts.Bar.convertOptions(materialOptions));
          button.innerText = 'Change to Classic';
          button.onclick = drawClassicChart;
        }

        function drawClassicChart() {
          var classicChart = new google.visualization.ColumnChart(chartDiv);
          classicChart.draw(data, classicOptions);
          button.innerText = 'Change to Material';
          button.onclick = drawMaterialChart;
        }

        drawMaterialChart();
    };
    </script>
  </head>
  <body>
    <button id="change-chart">Change to Classic</button>
    <br><br>
    <div id="chart_div" style="width: 800px; height: 500px;"></div>
  </body>
</html>

टॉप-X चार्ट

ध्यान दें: टॉप-X ऐक्सिस सिर्फ़ मटीरियल चार्ट के लिए उपलब्ध हैं. जैसे, पैकेज bar.

अगर आपको अपने चार्ट में, सबसे नीचे के बजाय X-ऐक्सिस लेबल और शीर्षक को जोड़ना है, तो axes.x विकल्प का इस्तेमाल करके, मटीरियल चार्ट में ऐसा किया जा सकता है:

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

      function drawStuff() {
        var data = new google.visualization.arrayToDataTable([
          ['Move', 'Percentage'],
          ["King's pawn (e4)", 44],
          ["Queen's pawn (d4)", 31],
          ["Knight to King 3 (Nf3)", 12],
          ["Queen's bishop pawn (c4)", 10],
          ['Other', 3]
        ]);

        var options = {
          width: 800,
          legend: { position: 'none' },
          chart: {
            title: 'Chess opening moves',
            subtitle: 'popularity by percentage' },
          axes: {
            x: {
              0: { side: 'top', label: 'White to move'} // Top x-axis.
            }
          },
          bar: { groupWidth: "90%" }
        };

        var chart = new google.charts.Bar(document.getElementById('top_x_div'));
        // Convert the Classic options to Material options.
        chart.draw(data, google.charts.Bar.convertOptions(options));
      };
    </script>
  </head>
  <body>
    <div id="top_x_div" style="width: 800px; height: 600px;"></div>
  </body>
</html>

लोड हो रहा है

google.charts.load पैकेज का नाम "corechart" है. विज़ुअलाइज़ेशन की क्लास का नाम google.visualization.ColumnChart है. 

  google.charts.load("current", {packages: ["corechart"]});

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

मटीरियल कॉलम चार्ट के लिए, google.charts.load पैकेज का नाम "bar" है. (गलत टाइपिंग नहीं: मटीरियल बार चार्ट दोनों ओरिएंटेशन को हैंडल करता है.) विज़ुअलाइज़ेशन की क्लास का नाम google.charts.Bar है. (यह टाइपो नहीं है: मटीरियल बार चार्ट दोनों ओरिएंटेशन को हैंडल करता है.)

  google.charts.load("current", {packages: ["bar"]});

  var chart = new google.charts.Bar(container);

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

टेबल की हर लाइन में, आस-पास के बार का ग्रुप दिखता है.

पंक्तियां: टेबल की हर पंक्ति, बार के ग्रुप को दिखाती है.

कॉलम:

  कॉलम 0 स्तंभ 1 ... कॉलम N
मकसद: इस समूह के 1 मान ... इस ग्रुप में, N वैल्यू को बार में लिखें
डेटा टाइप:
  • स्ट्रिंग (अलग)
  • संख्या, तारीख, तारीख समय या
    दिन का समय (लगातार)
संख्या ... संख्या
भूमिका: डोमेन डेटा ... डेटा
कॉलम की भूमिकाएं: ...

 

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

नाम
एनिमेशन.अवधि

ऐनिमेशन का कुल समय (मिलीसेकंड में). ज़्यादा जानकारी के लिए, ऐनिमेशन का दस्तावेज़ देखें.

टाइप: नंबर
डिफ़ॉल्ट: 0
एनिमेशन

ईज़िंग फ़ंक्शन ऐनिमेशन पर लागू किया गया. फ़िल्टर के लिए, यहां दिए गए विकल्प उपलब्ध होते हैं:

  • 'लीनियर' - स्थिर गति.
  • 'in' - ईज़ी-इन - धीमी गति से और गति से शुरू करें.
  • 'out' - Ease - जल्दी से शुरू करो और धीमा करो.
  • 'inAndOut' - ईज़ इन और आउट - धीमी गति से शुरू करें, गति बढ़ाएं, फिर धीमा करें.
टाइप: स्ट्रिंग
डिफ़ॉल्ट: 'लीनियर'
एनिमेशन

इससे तय होता है कि चार्ट शुरुआती ड्रॉ के दौरान ऐनिमेट होगा या नहीं. अगर true, चार्ट बेसलाइन पर शुरू होगा और अपनी आखिरी स्थिति पर ऐनिमेट करेगा.

टाइप: बूलियन
डिफ़ॉल्ट गलत
एनोटेशन

बार और कॉलम चार्ट में, अगर इसे true पर सेट किया जाता है, तो बार/कॉलम के बाहर सभी एनोटेशन को ड्रॉ किया जाता है.

टाइप: बूलियन
डिफ़ॉल्ट: गलत
एनोटेशन.boxStyle

एनोटेशन के साथ काम करने वाले चार्ट के लिए, annotations.boxStyle ऑब्जेक्ट, यह तय करता है कि आस-पास के एनोटेशन का बॉक्स कैसा दिखे: 

var options = {
  annotations: {
    boxStyle: {
      // Color of the box outline.
      stroke: '#888',
      // Thickness of the box outline.
      strokeWidth: 1,
      // x-radius of the corner curvature.
      rx: 10,
      // y-radius of the corner curvature.
      ry: 10,
      // Attributes for linear gradient fill.
      gradient: {
        // Start color for gradient.
        color1: '#fbf6a7',
        // Finish color for gradient.
        color2: '#33b679',
        // Where on the boundary to start and
        // end the color1/color2 gradient,
        // relative to the upper left corner
        // of the boundary.
        x1: '0%', y1: '0%',
        x2: '100%', y2: '100%',
        // If true, the boundary for x1,
        // y1, x2, and y2 is the box. If
        // false, it's the entire chart.
        useObjectBoundingBoxUnits: true
      }
    }
  }
};

फ़िलहाल, यह विकल्प क्षेत्र, बार, कॉलम, कॉम्बो, लाइन, और स्कैटर चार्ट के लिए काम करता है. यह एनोटेशन चार्ट के साथ काम नहीं करता.

टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: शून्य
एनोटेशन
एनोटेशन का इस्तेमाल करने वाले चार्ट के लिए, annotations.datum ऑब्जेक्ट, आपको अलग-अलग डेटा एलिमेंट (जैसे कि बार चार्ट पर मौजूद हर बार के साथ दिखने वाली वैल्यू) के लिए दिए गए एनोटेशन के लिए, Google चार्ट के विकल्प को बदलने की सुविधा देता है. annotations.datum.stem.color से स्टेम लंबाई annotations.datum.stem.length, और annotations.datum.style से स्टाइल को कंट्रोल किया जा सकता है.
टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: रंग "काला" है; लंबाई 12 है; शैली "पॉइंट" है.
एनोटेशन
व्याख्या का समर्थन करने वाले चार्ट के लिए, annotations.domain ऑब्जेक्ट आपको डोमेन के लिए दिए गए एनोटेशन के लिए Google चार्ट की पसंद को बदलने देता है (चार्ट का मुख्य अक्ष, जैसे कि सामान्य लाइन चार्ट पर X अक्ष). annotations.domain.stem.color से स्टेम लंबाई annotations.domain.stem.length, और annotations.domain.style से स्टाइल को कंट्रोल किया जा सकता है.
टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: रंग "काला" है; लंबाई 5 है; शैली "पॉइंट" है.
एनोटेशन
एनोटेशन के साथ काम करने वाले चार्ट में, annotations.highContrast बूलियन की मदद से, Google चार्ट में एनोटेशन के कलर को बदला जा सकता है. डिफ़ॉल्ट रूप से, annotations.highContrast सही होता है. इसकी वजह से, चार्ट में अच्छे कंट्रास्ट वाले हल्के रंग के साथ-साथ, हल्के बैकग्राउंड पर हल्के रंग होते हैं. अगर annotations.highContrast को 'गलत है' पर सेट किया जाता है, लेकिन अपने एनोटेशन के रंग की जानकारी नहीं दी जाती, तो Google चार्ट 'व्याख्या' के लिए डिफ़ॉल्ट सीरीज़ कलर का इस्तेमाल करेगा:
टाइप: बूलियन
डिफ़ॉल्ट: true
एनोटेशन
व्याख्या का समर्थन करने वाले चार्ट के लिए, annotations.stem ऑब्जेक्ट आपको स्टेम शैली के लिए Google चार्ट की पसंद को ओवरराइड करने देता है. annotations.stem.length की मदद से, रंग और annotations.stem.color की स्टेम लंबाई को कंट्रोल किया जा सकता है. ध्यान दें कि स्टेम लंबाई के विकल्प से 'line' स्टाइल वाले एनोटेशन पर कोई असर नहीं होता है: 'line' डाटुम एनोटेशन के लिए स्टेम लंबाई हमेशा टेक्स्ट के बराबर होती है और 'line' डोमेन एनोटेशन के लिए स्टेम पूरे चार्ट में फैला होता है.
टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: रंग "काला" है; डोमेन एनोटेशन के लिए लंबाई 5 है और डाटुम एनोटेशन के लिए 12 है.
एनोटेशन स्टाइल
एनोटेशन के साथ काम करने वाले चार्ट में, annotations.style के विकल्प की मदद से, आपके पास यह विकल्प होता है कि Google के चुने गए एनोटेशन के टाइप को बदल दें. यह 'line' या 'point' हो सकता है.
टाइप: स्ट्रिंग
डिफ़ॉल्ट: 'पॉइंट'
एनोटेशन का टेक्स्ट
एनोटेशन का इस्तेमाल करने वाले चार्ट के लिए, annotations.textStyle ऑब्जेक्ट, यह कंट्रोल करता है कि एनोटेशन का टेक्स्ट कैसा दिखे. 
var options = {
  annotations: {
    textStyle: {
      fontName: 'Times-Roman',
      fontSize: 18,
      bold: true,
      italic: true,
      // The color of the text.
      color: '#871b47',
      // The color of the text outline.
      auraColor: '#d799ae',
      // The transparency of the text.
      opacity: 0.8
    }
  }
};

फ़िलहाल, यह विकल्प क्षेत्र, बार, कॉलम, कॉम्बो, लाइन, और स्कैटर चार्ट के लिए काम करता है. यह एनोटेशन चार्ट के साथ काम नहीं करता.

टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: शून्य
ऐक्सिसशीर्षक स्थिति

चार्ट के एरिया की तुलना में, ऐक्सिस के शीर्षक कहां डालें. इस्तेमाल की जा सकने वाली वैल्यू:

  • में - चार्ट क्षेत्र के अंदर अक्ष के शीर्षक बनाएं.
  • आउट - चार्ट क्षेत्र के बाहर अक्ष शीर्षक बनाएं.
  • कोई नहीं - अक्ष के शीर्षकों को छोड़ दें.
टाइप: स्ट्रिंग
डिफ़ॉल्ट: 'आउट'
बैकग्राउंड का रंग

चार्ट के मुख्य हिस्से का बैकग्राउंड कलर. एचटीएमएल रंग की कोई सामान्य स्ट्रिंग हो सकती है. उदाहरण के लिए: 'red' या '#00cc00'. इसके अलावा, यह भी हो सकता है कि यहां बताई गई प्रॉपर्टी वाला कोई ऑब्जेक्ट हो.

टाइप: स्ट्रिंग या ऑब्जेक्ट
डिफ़ॉल्ट: 'सफ़ेद'
बैकग्राउंड का रंग

चार्ट के बॉर्डर का रंग, एचटीएमएल कलर स्ट्रिंग के तौर पर.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: '#666'
पृष्ठभूमिरंग.स्ट्रोकचौड़ाई

बॉर्डर की चौड़ाई, पिक्सल में.

टाइप: नंबर
डिफ़ॉल्ट: 0
बैकग्राउंड का रंग भरें

चार्ट, एचटीएमएल कलर स्ट्रिंग के तौर पर रंग भरता है.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: 'सफ़ेद'
Bar.groupWidth
बार के किसी ग्रुप की चौड़ाई, दोनों में से किसी एक फ़ॉर्मैट में बताई गई:
  • Pixel (जैसे कि 50).
  • हर ग्रुप के लिए उपलब्ध चौड़ाई का प्रतिशत (उदाहरण के लिए, '20%'), जहां '100%' का मतलब है कि ग्रुप के बीच कोई स्पेस नहीं है.
टाइप: संख्या या स्ट्रिंग
डिफ़ॉल्ट: स्वर्ण अनुपात, '61.8%' वाला है.
बार

सामग्री बार चार्ट में मौजूद बार, वर्टिकल या हॉरिज़ॉन्टल होते हैं या नहीं. इस विकल्प का क्लासिक बार चार्ट या क्लासिक कॉलम चार्ट पर कोई असर नहीं होगा.

टाइप: 'हॉरिज़ॉन्टल' या 'वर्टिकल'
डिफ़ॉल्ट: 'वर्टिकल'
चार्टक्षेत्र

सदस्यों के साथ एक ऑब्जेक्ट, जो चार्ट एरिया (जहां कि चार्ट खुद बनाया जाता है) के प्लेसमेंट और साइज़ को कॉन्फ़िगर करने के लिए इस्तेमाल किया जा सकता है. हालांकि, ऐक्सिस और लेजेंड को शामिल नहीं किया जा सकता. इसके लिए दो फ़ॉर्मैट इस्तेमाल किए जा सकते हैं: कोई संख्या या कोई संख्या और उसके बाद %. साधारण संख्या किसी मान को पिक्सल में दिखाती है और संख्या के बाद % होता है. उदाहरण: chartArea:{left:20,top:0,width:'50%',height:'75%'}

टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: शून्य
चार्टएरिया.बैकग्राउंड का रंग
चार्ट एरिया बैकग्राउंड का रंग. स्ट्रिंग का इस्तेमाल करने पर, यह हेक्स स्ट्रिंग हो सकती है (उदाहरण के लिए, '#fdc') या अंग्रेज़ी रंग का नाम. जब किसी ऑब्जेक्ट का इस्तेमाल किया जाता है, तो ये प्रॉपर्टी दी जा सकती हैं:
  • stroke: रंग, हेक्स स्ट्रिंग या अंग्रेज़ी रंग के नाम के तौर पर दिया जाता है.
  • strokeWidth: दिए जाने पर, दी गई चौड़ाई के चार्ट एरिया (और stroke रंग के साथ) के चारों ओर एक बॉर्डर बनाता है.
टाइप: स्ट्रिंग या ऑब्जेक्ट
डिफ़ॉल्ट: 'सफ़ेद'
चार्टएरिया

चार्ट को बाएं बॉर्डर से कितनी दूर बनाना है.

टाइप: संख्या या स्ट्रिंग
डिफ़ॉल्ट: अपने-आप
चार्टएरिया

चार्ट को ऊपर की सीमा से कितना दूर बनाना है.

टाइप: संख्या या स्ट्रिंग
डिफ़ॉल्ट: अपने-आप
चार्टएरिया

चार्ट एरिया की चौड़ाई.

टाइप: संख्या या स्ट्रिंग
डिफ़ॉल्ट: अपने-आप
चार्टएरीयल ऊंचाई

चार्ट एरिया की ऊंचाई.

टाइप: संख्या या स्ट्रिंग
डिफ़ॉल्ट: अपने-आप
चार्ट के सबटाइटल

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

टाइप: स्ट्रिंग
डिफ़ॉल्ट: शून्य
चार्ट शीर्षक

सामग्री चार्ट के लिए, यह विकल्प शीर्षक के बारे में बताता है.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: शून्य
कलर

चार्ट एलिमेंट के लिए इस्तेमाल किए जाने वाले रंग. स्ट्रिंग की श्रेणी, जहां हर एलिमेंट एक एचटीएमएल कलर स्ट्रिंग होता है, उदाहरण के लिए: colors:['red','#004411'].

टाइप: स्ट्रिंग की कैटगरी
डिफ़ॉल्ट: डिफ़ॉल्ट रंग
डेटा की ओपैसिटी

डेटा बिंदुओं की पारदर्शिता, 1.0 पूरी तरह से अपारदर्शी और 0.0 पूरी तरह से पारदर्शी है. स्कैटर, हिस्टोग्राम, बार, और कॉलम चार्ट में, यह दिखने वाले डेटा के बारे में बताता है: स्कैटर चार्ट में मौजूद बिंदु और दूसरे डाइमेंशन. ऐसे चार्ट में जहां डेटा को चुनने पर डॉट बनता है, जैसे कि लाइन और एरिया चार्ट, वहां पर ऐसे सर्कल दिखते हैं जो माउस घुमाने या चुनने पर दिखते हैं. कॉम्बो चार्ट में दोनों तरह के व्यवहार दिखते हैं और इस विकल्प का दूसरे चार्ट पर असर नहीं होता. (किसी रुझानलाइन की अपारदर्शिता को बदलने के लिए, ट्रेंडलाइन की ओपैसिटी देखें.)

टाइप: नंबर
डिफ़ॉल्ट: 1.0
इंटरैक्शन की सुविधा चालू करें

चार्ट, उपयोगकर्ता-आधारित इवेंट दिखाता है या उपयोगकर्ता के इंटरैक्शन पर प्रतिक्रिया देता है. अगर गलत है, तो चार्ट 'चुनें' या दूसरे इंटरैक्शन-आधारित इवेंट नहीं करेगा (लेकिन तैयार या गड़बड़ी वाले इवेंट को कराएगा), और उपयोगकर्ता के इनपुट के आधार पर होवर टेक्स्ट या दूसरे तरीके से नहीं दिखाएगा.

टाइप: बूलियन
डिफ़ॉल्ट: true
एक्सप्लोरर

explorer विकल्प की मदद से उपयोगकर्ता, Google चार्ट को पैन और ज़ूम कर सकते हैं. explorer: {}, डिफ़ॉल्ट एक्सप्लोरर व्यवहार की सुविधा देता है. इससे, उपयोगकर्ता स्क्रोल करके हॉरिज़ॉन्टल तौर पर और वर्टिकल तौर पर पैन कर पाते हैं. साथ ही, उन्हें स्क्रोल करके ज़ूम इन और आउट करने की सुविधा भी मिलती है.

यह सुविधा प्रयोग के तौर पर उपलब्ध है. साथ ही, इसे आने वाली रिलीज़ में भी बदला जा सकता है.

ध्यान दें: एक्सप्लोरर सिर्फ़ लगातार ऐक्सिस (जैसे, संख्या या तारीख) के साथ काम करता है.

टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: शून्य
explorer.action

Google के चार्ट एक्सप्लोरर पर तीन कार्रवाइयां की जा सकती हैं:

  • dragToPan: चार्ट के चारों ओर क्षैतिज और वर्टिकल रूप से पैन करने के लिए खींचें. सिर्फ़ हॉरिज़ॉन्टल ऐक्सिस पर पैन करने के लिए, explorer: { axis: 'horizontal' } का इस्तेमाल करें. इसी तरह वर्टिकल ऐक्सिस के लिए.
  • dragToZoom: एक्सप्लोरर का डिफ़ॉल्ट तरीका, उपयोगकर्ता के स्क्रोल करने पर ज़ूम इन और आउट करना होता है. अगर explorer: { actions: ['dragToZoom', 'rightClickToReset'] } का इस्तेमाल किया जाता है, तो आयत वाले किसी क्षेत्र को खींचकर उस जगह तक ज़ूम किया जाता है. हमारा सुझाव है कि जब भी dragToZoom का इस्तेमाल करें rightClickToReset का इस्तेमाल करें. ज़ूम को पसंद के मुताबिक बनाने के लिए, explorer.maxZoomIn, explorer.maxZoomOut, और explorer.zoomDelta देखें.
  • rightClickToReset: चार्ट पर दायां क्लिक करने से वह मूल पैन और ज़ूम लेवल पर वापस चला जाता है.
टाइप: स्ट्रिंग की कैटगरी
डिफ़ॉल्ट: ['dragToPan', 'rightClickToreset']
एक्सप्लोरर.ऐक्सिस

डिफ़ॉल्ट तौर पर, explorer विकल्प का इस्तेमाल करने पर उपयोगकर्ता, हॉरिज़ॉन्टल और वर्टिकल, दोनों पैन कर सकते हैं. अगर आपको उपयोगकर्ताओं को सिर्फ़ हॉरिज़ॉन्टल तौर पर पैन करना है, तो explorer: { axis: 'horizontal' } का इस्तेमाल करें. इसी तरह, explorer: { axis: 'vertical' } सिर्फ़ वर्टिकल पैनिंग की सुविधा देता है.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: हॉरिज़ॉन्टल और वर्टिकल पैनिंग, दोनों
explorer.keepInBounds

डिफ़ॉल्ट रूप से, उपयोगकर्ता डेटा क्षेत्र चाहे जो भी हो, पैन कर सकते हैं. यह पक्का करने के लिए कि उपयोगकर्ता ओरिजनल चार्ट से ज़्यादा पैन न करें, explorer: { keepInBounds: true } का इस्तेमाल करें.

टाइप: बूलियन
डिफ़ॉल्ट: गलत
explorer.maxZoomIn

वह अधिकतम सीमा जिसे एक्सप्लोरर ज़ूम इन कर सकता है. डिफ़ॉल्ट रूप से, उपयोगकर्ता इतना ज़ूम इन कर पाएंगे कि वे ओरिजनल व्यू का सिर्फ़ 25% हिस्सा ही देख पाएंगे. explorer: { maxZoomIn: .5 } को सेट करने पर, उपयोगकर्ता ओरिजनल व्यू का आधा हिस्सा ही देख पाएंगे.

टाइप: नंबर
डिफ़ॉल्ट: 0.25
एक्सप्लोरर.मैक्सज़ूम

वह अधिकतम सीमा जिसे एक्सप्लोरर ज़ूम आउट कर सकता है. डिफ़ॉल्ट रूप से, उपयोगकर्ता इतना ज़ूम आउट कर सकेंगे कि चार्ट उपलब्ध स्पेस का सिर्फ़ 1/4 हिस्सा ले सकेगा. explorer: { maxZoomOut: 8 } सेट करने पर उपयोगकर्ता ज़ूम आउट कर पाएंगे, ताकि चार्ट उसके उपलब्ध स्पेस का सिर्फ़ 1/8 तक इस्तेमाल कर सके.

टाइप: नंबर
डिफ़ॉल्ट: 4
explorer.zoomDelta

जब उपयोगकर्ता ज़ूम इन या आउट करते हैं, तो explorer.zoomDelta तय करता है कि उन्हें किस हद तक ज़ूम करना है. संख्या जितनी कम होती है, ज़ूम उतना ही आसान और धीमा होता है.

टाइप: नंबर
डिफ़ॉल्ट: 1.5
फ़ोकस टारगेट

जिस इकाई को माउस के कर्सर पर फ़ोकस किया गया है उसका टाइप. इससे यह भी तय होता है कि माउस की क्लिक से कौनसी इकाई चुनी गई है और इवेंट से कौनसा डेटा टेबल एलिमेंट जुड़ा है. इनमें से कोई एक हो सकती है:

  • 'datum' - एक डेटा पॉइंट पर फ़ोकस करें. डेटा टेबल में किसी सेल से जुड़ा है.
  • 'category' - मेजर ऐक्सिस के साथ सभी डेटा पॉइंट के ग्रुप बनाने पर ध्यान दें. डेटा टेबल की किसी पंक्ति से जुड़ी होती है.

फ़ोकस टारगेट 'कैटगरी' में टूलटिप, कैटगरी की सभी वैल्यू दिखाता है. इससे अलग-अलग सीरीज़ की वैल्यू की तुलना की जा सकती है.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: 'डेटा
फ़ॉन्ट का साइज़

चार्ट में मौजूद सभी टेक्स्ट का डिफ़ॉल्ट फ़ॉन्ट साइज़, पिक्सल में. इसे खास चार्ट एलिमेंट की प्रॉपर्टी का इस्तेमाल करके बदला जा सकता है.

टाइप: नंबर
डिफ़ॉल्ट: अपने-आप
फ़ॉन्ट का नाम

चार्ट के सभी टेक्स्ट के लिए, डिफ़ॉल्ट फ़ॉन्ट फ़ेस. इसे खास चार्ट एलिमेंट की प्रॉपर्टी का इस्तेमाल करके बदला जा सकता है.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: '{8/}'
फ़ोर्सआईफ़्रेम

चार्ट को इनलाइन फ़्रेम के अंदर दिखाता है. (ध्यान दें कि IE8 पर, इस विकल्प को अनदेखा किया जाता है; सभी IE8 चार्ट को i-frame में बनाया गया है.)

टाइप: बूलियन
डिफ़ॉल्ट: गलत
एचएक्सआई

सदस्य के साथ कोई ऑब्जेक्ट, जो हॉरिज़ॉन्टल ऐक्सिस के अलग-अलग एलिमेंट को कॉन्फ़िगर करता है. इस ऑब्जेक्ट की प्रॉपर्टी बताने के लिए, आप ऑब्जेक्ट लिटरल नोटेशन का इस्तेमाल कर सकते हैं, जैसा कि यहां दिखाया गया है: 

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: शून्य
hAxs.baseline

हॉरिज़ॉन्टल ऐक्सिस का बेसलाइन.

यह विकल्प सिर्फ़ continuous ऐक्सिस पर काम करता है.

टाइप: नंबर
डिफ़ॉल्ट: अपने-आप
hAxis.baselineColor

हॉरिज़ॉन्टल ऐक्सिस के लिए बेसलाइन का रंग. यह कोई भी एचटीएमएल कलर स्ट्रिंग हो सकती है, उदाहरण के लिए: 'red' या '#00cc00'.

यह विकल्प सिर्फ़ continuous ऐक्सिस पर काम करता है.

टाइप: नंबर
डिफ़ॉल्ट: 'काला'
hAxis.direction

वह दिशा जिसमें क्षैतिज अक्ष के साथ मान बढ़ते हैं. वैल्यू का क्रम उलटने के लिए, -1 बताएं.

टाइप: 1 या -1
डिफ़ॉल्ट: 1
hAxis.फ़ॉर्मैट

संख्या वाली या तारीख ऐक्सिस लेबल की फ़ॉर्मैट स्ट्रिंग.

नंबर ऐक्सिस लेबल के लिए, यह दशमलव फ़ॉर्मैट आईसीयू पैटर्न सेट का एक सबसेट है. उदाहरण के लिए, {format:'#,###%'}, 10, 7.5, और 0.5 की वैल्यू के लिए "1,000%", "750%", और "50%" वैल्यू दिखाएगा. इनमें से कोई भी जानकारी दी जा सकती है:

  • {format: 'none'}: फ़ॉर्मैट के बिना नंबर दिखाता है (जैसे, 8,00,00,000)
  • {format: 'decimal'}: विभाजकों की संख्या दिखाता है (उदाहरण, 80,00,000)
  • {format: 'scientific'}: वैज्ञानिक अंकन में संख्याएं दिखाता है (उदाहरण के लिए, 8e6)
  • {format: 'currency'}: स्थानीय मुद्रा में नंबर दिखाता है (उदाहरण, 80,00,000.00 डॉलर
  • {format: 'percent'}, संख्याओं को प्रतिशत के रूप में दिखाता है (उदाहरण, 8,00,00,000%)
  • {format: 'short'}: छोटे फ़ोन नंबर दिखाता है (उदाहरण के लिए, 80 लाख)
  • {format: 'long'}: संख्याओं को पूरे शब्दों के रूप में दिखाता है (उदाहरण, 80 लाख)

तारीख के ऐक्सिस लेबल के लिए, यह तारीख के फ़ॉर्मैट आईसीयू पैटर्न सेट का सबसेट होता है. उदाहरण के लिए, {format:'MMM d, y'} 1 जुलाई, 2011 की तारीख के लिए "1 जुलाई, 2011" वैल्यू दिखाएगा.

लेबल पर लागू की गई असल फ़ॉर्मैटिंग उस जगह से ली जाती है जहां एपीआई लोड किया गया है. ज़्यादा जानकारी के लिए, खास जगह के साथ चार्ट लोड करना देखें.

टिक वैल्यू और ग्रिडलाइन का हिसाब लगाने के लिए, मिलते-जुलते सभी ग्रिडलाइन विकल्पों के कई दूसरे कॉम्बिनेशन को ध्यान में रखा जाएगा. साथ ही, अगर चुने गए टिक लेबल के डुप्लीकेट या ओवरलैप होंगे, तो उनके विकल्पों को अस्वीकार कर दिया जाएगा. अगर आपको सिर्फ़ पूर्णांक टिक वैल्यू दिखानी है, तो format:"#" तय करें. हालांकि, ध्यान रखें कि अगर कोई विकल्प इस स्थिति के हिसाब से नहीं है, तो ग्रिडलाइन या टिक नहीं दिखेंगे.

यह विकल्प सिर्फ़ continuous ऐक्सिस के लिए काम करता है.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: अपने-आप
hAxs.gridlines

हॉरिज़ॉन्टल ऐक्सिस पर ग्रिडलाइन कॉन्फ़िगर करने की प्रॉपर्टी वाला ऑब्जेक्ट. ध्यान रखें कि हॉरिज़ॉन्टल ऐक्सिस ग्रिडलाइन वर्टिकल तौर पर बनाई गई हैं. इस ऑब्जेक्ट की प्रॉपर्टी बताने के लिए, आप ऑब्जेक्ट लिटरल नोटेशन का इस्तेमाल कर सकते हैं, जैसा कि यहां दिखाया गया है: 

{color: '#333', minSpacing: 20}

यह विकल्प सिर्फ़ continuous ऐक्सिस के लिए काम करता है.

टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: शून्य
hAxis.gridlines.color

चार्ट एरिया के अंदर हॉरिज़ॉन्टल ग्रिडलाइन का रंग. एचटीएमएल रंग की मान्य स्ट्रिंग बताएं.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: '#CCC'
hAxis.gridlines.count

चार्ट एरिया में हॉरिज़ॉन्टल ग्रिडलाइन की अनुमानित संख्या. अगर आप gridlines.count के लिए पॉज़िटिव नंबर डालते हैं, तो इसका इस्तेमाल ग्रिडलाइन के बीच minSpacing का हिसाब लगाने के लिए किया जाएगा. सिर्फ़ एक ग्रिडलाइन बनाने के लिए, 1 की वैल्यू तय की जा सकती है या कोई ग्रिडलाइन न बनाने के लिए, 0 की वैल्यू तय की जा सकती है. दूसरे विकल्पों के आधार पर, ग्रिडलाइन की संख्या अपने-आप कैलकुलेट करने के लिए, -1 तय करें. यह डिफ़ॉल्ट रूप से, इस्तेमाल किया जाता है.

टाइप: नंबर
डिफ़ॉल्ट: -1
hAxis.gridlines.interval

ग्रिडलाइन के बीच साइज़ की श्रेणी (डेटा वैल्यू के तौर पर, न कि पिक्सल). यह विकल्प, सिर्फ़ संख्या वाले ऐक्सिस के लिए है. हालांकि, यह gridlines.units.<unit>.interval के उन विकल्पों के जैसा ही है जिनका इस्तेमाल सिर्फ़ तारीखों और समय के लिए किया जाता है. लीनियर स्केल के लिए, डिफ़ॉल्ट [1, 2, 2.5, 5] है, जिसका मतलब है कि ग्रिडलाइन की वैल्यू हर यूनिट (1), ईवन यूनिट (2) या 2.5 या 5 के मल्टीपल पर हो सकती हैं. इन वैल्यू को 10 से गुणा करने पर मिलने वाली वैल्यू को भी [10, 20, 25, 50], और [.1, .2, .25, .5] में शामिल किया जाता है. लॉग स्केल के लिए, डिफ़ॉल्ट विकल्प [1, 2, 5] है.

टाइप: 1 से 10 के बीच की संख्या, जिसमें 10 शामिल नहीं हैं.
डिफ़ॉल्ट: कंप्यूट किया गया
hAxis.gridlines.minSpac

hAxis मेजर ग्रिडलाइन के बीच पिक्सल में कम से कम स्क्रीन स्पेस. बड़ी ग्रिडलाइनों के लिए डिफ़ॉल्ट विकल्प, 40 लीनियर स्केल के लिए और 20 लॉग स्केल के लिए है. अगर आप minSpacing के बजाय count को तय करते हैं, तो minS हैपर को गिनती से गिना जाता है. इसके उलट, अगर आप count के बजाय minSpacing बताते हैं, तो गिनती को कम से कम वैल्यू के आधार पर कैलकुलेट किया जाता है. दोनों को तय करने पर, minSpacing बदल जाता है.

टाइप: नंबर
डिफ़ॉल्ट: कंप्यूट किया गया
hAxis.gridlines.मल्टी

सभी ग्रिडलाइन और टिक वैल्यू, इस विकल्प की वैल्यू के एक से ज़्यादा होने चाहिए. ध्यान दें कि 10 बार के अंतर को इंटरवल के उलट, गुणा करने के नतीजे नहीं माना जाता. इसलिए, आप gridlines.multiple = 1 तय करके टिक को पूर्णांक मानने के लिए कह सकते हैं या gridlines.multiple = 1000 बताकर टिक को 1000 के गुणांक में बदल सकते हैं.

टाइप: नंबर
डिफ़ॉल्ट: 1
hAxis.gridlines.units

चार्ट के लिए कंप्यूट किए गए ग्रिडलाइन का इस्तेमाल करने पर, तारीख/तारीख और समय के अलग-अलग टाइप के डेटा के डिफ़ॉल्ट फ़ॉर्मैट को बदल देता है. साल, महीने, दिन, घंटे, मिनट, सेकंड, और मिलीसेकंड के लिए फ़ॉर्मैट करने की सुविधा देता है.

सामान्य फ़ॉर्मैट यह है:

gridlines: {
  units: {
    years: {format: [/*format strings here*/]},
    months: {format: [/*format strings here*/]},
    days: {format: [/*format strings here*/]}
    hours: {format: [/*format strings here*/]}
    minutes: {format: [/*format strings here*/]}
    seconds: {format: [/*format strings here*/]},
    milliseconds: {format: [/*format strings here*/]},
  }
}

तारीख और समय में, ज़्यादा जानकारी देखी जा सकती है.

टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: शून्य
hAxis.minorGridlines

एक ऑब्जेक्ट, जिसमें हॉरिज़ॉन्टल ऐक्सिस पर hAxis.gridlines विकल्प के समान छोटी ग्रिडलाइन को कॉन्फ़िगर किया जाता है.

यह विकल्प सिर्फ़ continuous ऐक्सिस के लिए काम करता है.

टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: शून्य
hAxis.minorGridlines.color

चार्ट एरिया में हॉरिज़ॉन्टल माइनर ग्रिडलाइन का रंग. एचटीएमएल रंग की मान्य स्ट्रिंग बताएं.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: ग्रिडलाइन और बैकग्राउंड के रंगों का ब्लेंड
hAxis.minorGridlines.count

minorGridlines.count विकल्प ज़्यादातर काम नहीं करता है. हालांकि, छोटी ग्रिड को बंद करने के लिए, गिनती को 0 पर सेट करें. अब छोटी ग्रिडलाइनों की संख्या मुख्य ग्रिडलाइनों (hAxis.gridlines.interval देखें) और कम से कम ज़रूरी स्पेस (hAxis.minorGridlines.minSpacing देखें) के बीच के इंटरवल पर निर्भर करती है.

टाइप: नंबर
डिफ़ॉल्ट:1
hAxis.minorGridlines.interval

थोड़ा ग्रिडलाइन.इंटरवल विकल्प, मेजर ग्रिडलाइन इंटरवल विकल्प की तरह है. हालांकि, चुना गया इंटरवल हमेशा प्रमुख ग्रिडलाइन इंटरवल के बराबर होगा. लीनियर स्केल का डिफ़ॉल्ट इंटरवल [1, 1.5, 2, 2.5, 5] है और लॉग स्केल के लिए [1, 2, 5] है.

टाइप: नंबर
डिफ़ॉल्ट:1
hAxis.minorGridlines.minSpacing

सबसे छोटी ज़रूरी जगह, पिक्सल में, छोटी छोटी ग्रिडलाइन के बीच, और छोटी और बड़ी ग्रिडलाइन के बीच. डिफ़ॉल्ट वैल्यू, लीनियर स्केल के लिए बड़ी ग्रिडलाइनों की 1/2 मिनट की दूरी और लॉग स्केल के लिए 1/5 मिनट की स्पेसिंग है.

टाइप: नंबर
डिफ़ॉल्ट:हिसाब लगाया गया
hAxis.minorGridlines.एकाधिक

gridlines.multiple की तरह.

टाइप: नंबर
डिफ़ॉल्ट: 1
hAxis.minorGridlines.units

चार्ट कंप्यूट माइनर ग्रिडलाइन के साथ इस्तेमाल किए जाने पर, तारीख/तारीख/समयका डेटा टाइप के अलग-अलग पहलुओं के लिए डिफ़ॉल्ट फ़ॉर्मैट को बदल देता है. साल, महीने, दिन, घंटे, मिनट, सेकंड, और मिलीसेकंड के लिए फ़ॉर्मैट करने की सुविधा देता है.

सामान्य फ़ॉर्मैट यह है:

gridlines: {
  units: {
    years: {format: [/*format strings here*/]},
    months: {format: [/*format strings here*/]},
    days: {format: [/*format strings here*/]}
    hours: {format: [/*format strings here*/]}
    minutes: {format: [/*format strings here*/]}
    seconds: {format: [/*format strings here*/]},
    milliseconds: {format: [/*format strings here*/]},
  }
}

तारीख और समय में, ज़्यादा जानकारी देखी जा सकती है.

टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: शून्य
hAxis.logScale

hAxis प्रॉपर्टी, जो हॉरिज़ॉन्टल ऐक्सिस को लॉगरिद्मिक स्केल बनाती है (सभी वैल्यू को पॉज़िटिव होना ज़रूरी है). हां के लिए 'सही' पर सेट करें.

यह विकल्प सिर्फ़ continuous ऐक्सिस पर काम करता है.

टाइप: बूलियन
डिफ़ॉल्ट: गलत
hAxis.ScaleType

hAxis प्रॉपर्टी, जो हॉरिज़ॉन्टल ऐक्सिस को लॉगरिद्मिक स्केल बनाती है. इनमें से कोई एक हो सकता है:

  • शून्य - लॉगरिद्मिक स्केलिंग नहीं की जाती.
  • 'log' - लॉगरिद्मिक स्केलिंग. शून्य और शून्य मान नहीं दिखाए जाते. यह विकल्प, hAxis: { logscale: true } को सेट करने जैसा ही है.
  • 'MirrorLog' - लॉगारिद्मिक स्केलिंग जिसमें नेगेटिव और शून्य मान प्लॉट किए जाते हैं. नेगेटिव संख्या का प्लॉट की गई वैल्यू, निरपेक्ष वैल्यू के लॉग का नेगेटिव होता है. शून्य के करीब की वैल्यू को लीनियर स्केल पर दिखाया जाता है.

यह विकल्प सिर्फ़ continuous ऐक्सिस पर काम करता है.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: शून्य
hAxis.textPosition

चार्ट के एरिया के हिसाब से हॉरिज़ॉन्टल ऐक्सिस के टेक्स्ट की जगह. इस्तेमाल की जा सकने वाली वैल्यू: 'out', 'in', 'none'.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: 'आउट'
hAxis.textStyle

ऑब्जेक्ट, जो हॉरिज़ॉन्टल ऐक्सिस के टेक्स्ट की स्टाइल बताता है. ऑब्जेक्ट का फ़ॉर्मैट ऐसा है:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }

color कोई भी एचटीएमएल कलर स्ट्रिंग हो सकती है, उदाहरण के लिए: 'red' या '#00cc00'. fontName और fontSize भी देखें.

टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
एचएक्सिस

अपने-आप बने X-अक्ष टिक को बताई गई श्रेणी से बदलता है. श्रेणी का हर एलिमेंट एक मान्य टिक वैल्यू होना चाहिए (जैसे कि कोई संख्या, तारीख, तारीख या दिन का समय) या कोई ऑब्जेक्ट. अगर यह कोई ऑब्जेक्ट है, तो इसमें टिक वैल्यू के लिए v प्रॉपर्टी होनी चाहिए. साथ ही, एक वैकल्पिक f प्रॉपर्टी होनी चाहिए, जिसमें लिटरल स्ट्रिंग लेबल के तौर पर दिखे.

व्यू विंडो को अपने-आप बड़ा और छोटा करने के लिए, बड़ा करके दिखाया जाता है. ऐसा तब तक किया जाता है, जब तक आप viewWindow.min या viewWindow.max को ओवरराइड नहीं करते.

उदाहरण:

  • hAxis: { ticks: [5,10,15,20] }
  • hAxis: { ticks: [{v:32, f:'thirty two'}, {v:64, f:'sixty four'}] }
  • hAxis: { ticks: [new Date(2014,3,15), new Date(2013,5,15)] }
  • hAxis: { ticks: [16, {v:32, f:'thirty two'}, {v:64, f:'sixty four'}, 128] }

यह विकल्प सिर्फ़ continuous ऐक्सिस के लिए काम करता है.

टाइप: एलिमेंट की कैटगरी
डिफ़ॉल्ट: अपने-आप
hAxs.title

hAxis प्रॉपर्टी, जो हॉरिज़ॉन्टल ऐक्सिस का शीर्षक बताती है.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: शून्य
hAxis.titleTextStyle

ऐसा ऑब्जेक्ट जो हॉरिज़ॉन्टल ऐक्सिस के शीर्षक के स्टाइल की जानकारी देता है. ऑब्जेक्ट का फ़ॉर्मैट ऐसा है: 

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }

color कोई भी एचटीएमएल कलर स्ट्रिंग हो सकती है, उदाहरण के लिए: 'red' या '#00cc00'. fontName और fontSize भी देखें.

टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
hAxis.allowContainerBoundaryTextCutoff

गलत होने पर, चार्ट के कंटेनर से काटे जाने के बजाय, सबसे बाहरी लेबल को छिपा दिया जाएगा. सही होने पर, लेबल को काटने की अनुमति दी जाएगी.

यह विकल्प सिर्फ़ discrete ऐक्सिस पर काम करता है.

टाइप: बूलियन
डिफ़ॉल्ट: गलत
hAxis.slantedText

सही होने पर, ऐक्सिस के साथ ज़्यादा टेक्स्ट फ़िट करने के लिए ऐंगल पर हॉरिज़ॉन्टल ऐक्सिस वाला टेक्स्ट बनाएं. अगर गलत है, तो हॉरिज़ॉन्टल ऐक्सिस के टेक्स्ट को ऊपर की ओर बनाएं. डिफ़ॉल्ट तौर पर, टेक्स्ट को तिरछा बनाने पर, उसे तिरछा किया जाता है. ध्यान दें कि यह विकल्प सिर्फ़ तब उपलब्ध होता है, जब hAxis.textPosition को 'आउट' पर सेट किया जाता है (जो डिफ़ॉल्ट है). तारीखों और समय के लिए, false डिफ़ॉल्ट है.

टाइप: बूलियन
डिफ़ॉल्ट: अपने-आप
hAxis.slantedTextAngle

क्षैतिज अक्ष के टेक्स्ट का कोण, अगर उसे तिरछा बनाया गया है. अगर hAxis.slantedText false है या अपने-आप मोड में है, तो इसे अनदेखा किया जाता है. साथ ही, चार्ट ने टेक्स्ट को हॉरिज़ॉन्टल तरीके से ड्रॉ करने का फ़ैसला किया है. अगर कोण पॉज़िटिव है, तो घड़ी की दिशा घड़ी की उल्टी दिशा में होती है और नेगेटिव होने पर घड़ी की दिशा में.

टाइप: नंबर, -90—90
डिफ़ॉल्ट: 30
hAxis.maxAlternation

हॉरिज़ॉन्टल ऐक्सिस के टेक्स्ट के लेवल की ज़्यादा से ज़्यादा संख्या. अगर ऐक्सिस टेक्स्ट लेबल में बहुत ज़्यादा संख्या है, तो सर्वर पास के लेबल को ऊपर या नीचे शिफ़्ट कर सकते हैं. ऐसा, लेबल को एक-दूसरे के करीब रखने के लिए किया जाता है. इस वैल्यू में, इस्तेमाल किए जाने वाले ज़्यादातर लेवल के बारे में बताया जाता है. अगर लेबल ओवरलैप किए बिना फ़िट हो सकते हैं, तो सर्वर कम लेवल इस्तेमाल कर सकता है. तारीखों और समय के लिए, डिफ़ॉल्ट वैल्यू 1 होती है.

टाइप: नंबर
डिफ़ॉल्ट: 2
hAxis.maxTextLines

टेक्स्ट लेबल के लिए, लाइनों की ज़्यादा से ज़्यादा संख्या की अनुमति है. अगर लेबल की लंबाई बहुत ज़्यादा है, तो वे एक से ज़्यादा लाइनों में दिख सकते हैं. साथ ही, लेबल की संख्या डिफ़ॉल्ट रूप से, उपलब्ध जगह की ऊंचाई से सीमित होती है.

टाइप: नंबर
डिफ़ॉल्ट: अपने-आप
hAxis.minTextSpac

पिक्सल के अंदर, कम से कम हॉरिज़ॉन्टल स्पेसिंग का इस्तेमाल, टेक्स्ट के बगल में मौजूद दो लेबल के बीच किया जा सकता है. अगर लेबल बहुत ज़्यादा डाले गए हैं या वे बहुत बड़े हैं, तो स्पेस की संख्या इस थ्रेशोल्ड से कम हो सकती है. ऐसे में, लेबल को व्यवस्थित करने के किसी एक तरीके को लागू किया जाएगा. उदाहरण के लिए, लेबल को छोटा करना या उनमें से कुछ को छोड़ना.

टाइप: नंबर
डिफ़ॉल्ट: hAxis.textStyle.fontSize की वैल्यू
hAxs.showTextहर

दिखाने के लिए कितने हॉरिज़ॉन्टल ऐक्सिस के लेबल हैं, जहां 1 का मतलब है कि हर लेबल दिखाएं, 2 का मतलब है हर दूसरा लेबल वगैरह. बिना ओवरलैप किए ज़्यादा से ज़्यादा लेबल दिखाने की कोशिश करना, डिफ़ॉल्ट तरीका होता है.

टाइप: नंबर
डिफ़ॉल्ट: अपने-आप
hAxis.maxValue

हॉरिज़ॉन्टल ऐक्सिस के ज़्यादा से ज़्यादा मान को तय वैल्यू पर ले जाता है. यह ज़्यादातर चार्ट में दाईं ओर होगा. अगर इस वैल्यू को डेटा के ज़्यादा से ज़्यादा x-वैल्यू से कम पर सेट किया जाता है, तो अनदेखा किया जाता है. hAxis.viewWindow.max, इस प्रॉपर्टी को बदल देता है.

यह विकल्प सिर्फ़ continuous ऐक्सिस के लिए काम करता है.

टाइप: नंबर
डिफ़ॉल्ट: अपने-आप
hAxis.minValue

हॉरिज़ॉन्टल ऐक्सिस के कम से कम मान को तय वैल्यू पर ले जाता है. ज़्यादातर चार्ट में इसे बाईं ओर ले जाया जाएगा. अगर यह डेटा के कम से कम x-मान से ज़्यादा मान पर सेट है, तो अनदेखा कर दिया जाएगा. hAxis.viewWindow.min, इस प्रॉपर्टी को बदल देता है.

यह विकल्प सिर्फ़ continuous ऐक्सिस के लिए काम करता है.

टाइप: नंबर
डिफ़ॉल्ट: अपने-आप
hAxis.viewwindowMode

चार्ट क्षेत्र में मानों को रेंडर करने के लिए क्षैतिज अक्ष को स्केल करने का तरीका बताता है. स्ट्रिंग की इन वैल्यू का इस्तेमाल किया जा सकता है:

  • 'प्रिटी' - हॉरिज़ॉन्टल वैल्यू स्केल करें, ताकि चार्ट के बाएं और दाएं, चार्ट के बाएं और दाएं हिस्से में, कम से कम और कम से कम डेटा वैल्यू को रेंडर किया जा सके. Viewविंडो को संख्याओं के लिए निकटतम मेजर ग्रिडलाइन या तारीख और समय के लिए निकटतम छोटी ग्रिडलाइन के लिए विस्तृत किया जाता है.
  • 'ज़्यादा से ज़्यादा' - हॉरिज़ॉन्टल वैल्यू स्केल करें, ताकि ज़्यादा से ज़्यादा और कम से कम डेटा वैल्यू, चार्ट के बाएं और दाएं हिस्से को छू सकें. ऐसा करने पर, haxis.viewWindow.min और haxis.viewWindow.max को अनदेखा कर दिया जाएगा.
  • 'साफ़' - चार्ट क्षेत्र के बाएं और दाएं स्केल मान को तय करने के लिए बहिष्कृत विकल्प. (इसका इस्तेमाल अब नहीं किया जाता है, क्योंकि यह haxis.viewWindow.min और haxis.viewWindow.max के साथ ज़रूरी नहीं है.) इन वैल्यू से बाहर के डेटा की वैल्यू को काटा जाएगा. आपको hAxis.viewWindow ऑब्जेक्ट के बारे में जानकारी देनी होगी. इसमें यह बताया जाना चाहिए कि दिखाने के लिए ज़्यादा से ज़्यादा और कम से कम वैल्यू कितनी होनी चाहिए.

यह विकल्प सिर्फ़ continuous ऐक्सिस के लिए काम करता है.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: यह ' बहुत सुंदर' के बराबर है, लेकिन इस्तेमाल किए जाने पर haxis.viewWindow.min और haxis.viewWindow.max को प्राथमिकता दी जाती है.
hAxis.viewविंडो

हॉरिज़ॉन्टल ऐक्सिस की काट-छांट की रेंज बताता है.

टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: शून्य
hAxis.viewwindow.max

  • continuous ऐक्सिस के लिए:

    रेंडर करने के लिए ज़्यादा से ज़्यादा क्षैतिज डेटा मान.

  • discrete ऐक्सिस के लिए:

    ज़ीरो-आधारित पंक्ति इंडेक्स जहां से क्रॉपिंग विंडो खत्म होती है. इस इंडेक्स और इसके बाद के डेटा को काटा जाएगा. vAxis.viewWindowMode.min के साथ, यह आधी खुली हुई सीमा [min, max) को तय करता है, जो एलिमेंट के इंडेक्स को दिखाता है. दूसरे शब्दों में, min <= index < max जैसा हर इंडेक्स दिखाया जाएगा.

hAxis.viewWindowMode को ' सुंदर' या 'ज़्यादा से ज़्यादा किया गया' होने पर अनदेखा किया जाता है.

टाइप: नंबर
डिफ़ॉल्ट: अपने-आप
hAxis.viewwindow.min

  • continuous ऐक्सिस के लिए:

    रेंडर करने के लिए कम से कम हॉरिज़ॉन्टल डेटा वैल्यू.

  • discrete ऐक्सिस के लिए:

    ज़ीरो-आधारित पंक्ति इंडेक्स जहां से क्रॉपिंग विंडो शुरू होती है. इंडेक्स में इससे नीचे के डेटा पॉइंट काट दिए जाएंगे. vAxis.viewWindowMode.max के साथ, यह आधी खुली हुई सीमा [min, max) को तय करता है, जो एलिमेंट के इंडेक्स को दिखाता है. दूसरे शब्दों में, min <= index < max जैसा कोई भी इंडेक्स दिखाया जाएगा.

hAxis.viewWindowMode को ' सुंदर' या 'ज़्यादा से ज़्यादा किया गया' होने पर अनदेखा किया जाता है.

टाइप: नंबर
डिफ़ॉल्ट: अपने-आप
ऊंचाई

चार्ट की ऊंचाई, पिक्सल में.

टाइप: नंबर
डिफ़ॉल्ट: शामिल एलिमेंट की ऊंचाई
स्टैक स्टैक किया गया

अगर इसे 'सही है' पर सेट किया जाता है, तो सभी डोमेन वैल्यू पर सभी सीरीज़ के एलिमेंट को स्टैक करता है. ध्यान दें: कॉलम, क्षेत्र, और Steppedarea चार्ट में, Google Maps, लेजेंड आइटम के क्रम को उलटा कर देता है, ताकि सीरीज़ के एलिमेंट को स्टैकिंग के साथ जोड़ा जा सके. उदाहरण के लिए, सीरीज़ 0 सबसे नीचे मौजूद लेजेंड आइटम होगी. यह चार्ट पर लागू नहीं होताBar है.

isStacked के विकल्प को भी 100% स्टैकिंग के साथ इस्तेमाल किया जा सकता है. हर डोमेन वैल्यू के एलिमेंट के स्टैक को 100% तक जोड़ने के लिए, उन्हें रीस्केल किया जाता है.

isStacked के लिए ये विकल्प हैं:

  • false — एलिमेंट स्टैक नहीं होंगे. यह डिफ़ॉल्ट विकल्प है.
  • true — हर डोमेन वैल्यू पर, सभी सीरीज़ के एलिमेंट को स्टैक करता है.
  • 'percent' — हर डोमेन वैल्यू पर, सभी सीरीज़ के एलिमेंट को स्टैक करता है और उन्हें इस तरह रीस्केल करता है कि वे 100% तक जुड़ जाते हैं. साथ ही, हर एलिमेंट की वैल्यू का हिसाब 100% होता है.
  • 'relative' — हर डोमेन वैल्यू पर, सभी सीरीज़ के एलिमेंट को स्टैक करता है और उन्हें इस तरह रीस्केल करता है कि वे 1 तक जुड़ जाते हैं. साथ ही, हर एलिमेंट की वैल्यू का हिसाब 1 के रूप में लगाया जाता है.
  • 'absolute' — isStacked: true की तरह काम करता है.

100% स्टैकिंग के लिए, हर एलिमेंट की तय की गई वैल्यू, उसके असल वैल्यू के बाद टूलटिप में दिखेगी.

टारगेट ऐक्सिस, रिलेटिव 0-1 स्केल के आधार पर वैल्यू को 'relative' के लिए 1 के अंश के तौर पर और 'percent' के लिए 0-100% पर डिफ़ॉल्ट रूप से सेट करेगी (ध्यान दें: 'percent' विकल्प का इस्तेमाल करते समय, ऐक्सिस/टिक की वैल्यू प्रतिशत के तौर पर दिखती हैं. हालांकि, असली वैल्यू रिलेटिव 0-1 स्केल वैल्यू होती हैं. इसकी वजह यह है कि प्रतिशत ऐक्सिस के टिक, 0-1 के पैमाने वाली वैल्यू पर "#.##%" फ़ॉर्मैट लागू करते हैं. isStacked: 'percent' का इस्तेमाल करते समय, सही 0-1 स्केल वैल्यू का इस्तेमाल करके सही टिक या ग्रिडलाइन ज़रूर डालें. hAxis/vAxis के सही विकल्पों का इस्तेमाल करके, ग्रिडलाइन/टिक वैल्यू और फ़ॉर्मैटिंग को पसंद के मुताबिक बनाया जा सकता है.

100% स्टैकिंग सिर्फ़ number टाइप के डेटा वैल्यू के साथ काम करती है और इसकी बेसलाइन शून्य होनी चाहिए.

टाइप: बूलियन/स्ट्रिंग
डिफ़ॉल्ट: गलत
लेजेंड

लेजेंड के अलग-अलग पहलुओं को कॉन्फ़िगर करने वाला एक ऑब्जेक्ट. इस ऑब्जेक्ट की प्रॉपर्टी बताने के लिए, आप ऑब्जेक्ट लिटरल नोटेशन का इस्तेमाल कर सकते हैं, जैसा कि यहां दिखाया गया है: 

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}
टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: शून्य
लेजेंड.पेज इंडेक्स

लेजेंड के शुरुआती आधार पर, शून्य पर आधारित पेज इंडेक्स.

टाइप: नंबर
डिफ़ॉल्ट: 0
लेजेंड.स्थिति

लेजेंड की जगह. इनमें से कोई एक हो सकता है:

  • 'सबसे नीचे' - चार्ट के नीचे.
  • 'left' - चार्ट के बाईं ओर मौजूद है, बशर्ते कि बाईं ओर के ऐक्सिस से कोई सीरीज़ न जुड़ी हो. इसलिए, अगर आपको बाईं ओर लेजेंड जोड़ना है, तो targetAxisIndex: 1 विकल्प का इस्तेमाल करें.
  • 'in' - चार्ट के अंदर, सबसे ऊपर बाएं कोने में.
  • 'कोई नहीं' - कोई लेजेंड नहीं दिखाया गया है.
  • 'right' - चार्ट के दाईं ओर. vAxes विकल्प के साथ काम नहीं करता.
  • 'ऊपर' - चार्ट के ऊपर.
टाइप: स्ट्रिंग
डिफ़ॉल्ट: 'दाएं'
लेजेंड.संरेखण

लेजेंड का अलाइनमेंट. इनमें से कोई एक हो सकता है:

  • 'शुरू करें' - लेजेंड के लिए असाइन किए गए इलाके की शुरुआत के हिसाब से अलाइन किया गया.
  • 'center' - लीजेंड के लिए आवंटित क्षेत्र में केंद्रित.
  • 'end' - लीजेंड के लिए आबंटित क्षेत्र के अंत में संरेखित.

शुरू करने, बीच में, और खत्म होने से यह तय होता है कि लेजेंड- स्टाइल, वर्टिकल या हॉरिज़ॉन्टल है. उदाहरण के लिए, 'दाएं' लेजेंड में, 'शुरू' और 'आखिर', क्रम में सबसे ऊपर और सबसे नीचे होते हैं; 'ऊपर' लेजेंड के लिए, 'शुरू' और 'आखिर', जगह के बाईं और दाईं ओर होंगे.

डिफ़ॉल्ट वैल्यू, लेजेंड की जगह पर निर्भर करती है. 'निचले' लेजेंड के लिए, डिफ़ॉल्ट रूप से 'center' होता है और दूसरा लेजेंड 'start' होता है.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: अपने-आप
लेजेंड.टेक्स्टस्टाइल

ऐसा ऑब्जेक्ट जो लेजेंड टेक्स्ट की स्टाइल बताता है. ऑब्जेक्ट का फ़ॉर्मैट ऐसा है:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }

color कोई भी एचटीएमएल कलर स्ट्रिंग हो सकती है, उदाहरण के लिए: 'red' या '#00cc00'. fontName और fontSize भी देखें.

टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
ओरिएंटेशन

चार्ट का ओरिएंटेशन. 'vertical' पर सेट होने पर, चार्ट की ऐक्सिस को घुमाता है (उदाहरण के लिए), कॉलम चार्ट बार बार चार्ट में बदल जाता है और एरिया चार्ट ऊपर की बजाय दाईं ओर बढ़ता है.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: 'हॉरिज़ॉन्टल'
रिवरकैटगरी श्रेणियां

अगर इसे 'सही है' पर सेट किया जाता है, तो सीरीज़ को दाईं से बाईं ओर दिखाया जाएगा. डिफ़ॉल्ट बाएं-से-दाएं बनाना है.

यह विकल्प सिर्फ़ discrete major ऐक्सिस पर काम करता है.

टाइप: बूलियन
डिफ़ॉल्ट: गलत
शृंखला

ऑब्जेक्ट की कैटगरी, हर चार्ट में उससे जुड़ी सीरीज़ के फ़ॉर्मैट की जानकारी देती है. किसी सीरीज़ के लिए डिफ़ॉल्ट वैल्यू का इस्तेमाल करने के लिए, एक खाली ऑब्जेक्ट {} बताएं. अगर कोई सीरीज़ या वैल्यू तय नहीं की गई है, तो ग्लोबल वैल्यू का इस्तेमाल किया जाएगा. हर ऑब्जेक्ट इन प्रॉपर्टी के साथ काम करता है:

  • annotations - इस सीरीज़ के एनोटेशन पर लागू किया जाने वाला ऑब्जेक्ट. इसका इस्तेमाल कंट्रोल करने में किया जा सकता है. उदाहरण के लिए, सीरीज़ के लिए, textStyle: 

    series: {
  0: {
    annotations: {
      textStyle: {fontSize: 12, color: 'red' }
    }
  }
}

    पसंद के मुताबिक बनाई जा सकने वाली चीज़ों की ज़्यादा सूची के लिए, annotations के अलग-अलग विकल्प देखें.

  • color - इस सीरीज़ के लिए इस्तेमाल किया जाने वाला रंग. मान्य एचटीएमएल कलर स्ट्रिंग बताएं.
  • targetAxisIndex - किस सीरीज़ को असाइन करना है, जहां 0 डिफ़ॉल्ट ऐक्सिस है और 1, दूसरा ऐक्सिस है. डिफ़ॉल्ट वैल्यू 0 होती है; 1 पर सेट करके ऐसा चार्ट बनाया जाता है जिसमें अलग-अलग ऐक्सिस पर अलग-अलग सीरीज़ रेंडर की जाती हैं. कम से कम एक सीरीज़ को डिफ़ॉल्ट ऐक्सिस में बांट दिया जाएगा. अलग-अलग ऐक्सिस के लिए अलग-अलग स्केल तय किया जा सकता है.
  • visibleInLegend - एक बूलियन वैल्यू, जहां सही का मतलब है कि सीरीज़ में एक लेजेंड एंट्री होनी चाहिए और गलत का मतलब है कि वह नहीं होना चाहिए. यह डिफ़ॉल्ट रूप से 'सही' पर सेट होती है.

आपके पास ऑब्जेक्ट के कलेक्शन के लिए एक क्रम तय करने का विकल्प होता है. हर ऑब्जेक्ट, सीरीज़ के दिए गए क्रम में लागू होता है या आपके पास एक ऐसा ऑब्जेक्ट तय करने का विकल्प होता है जिसमें हर बच्चे के लिए संख्या वाली कुंजी होती है. इससे पता चलता है कि वह कौनसी सीरीज़ पर लागू होती है. उदाहरण के लिए, ये दो एलान एक जैसे हैं. इनमें पहली सीरीज़ को, श्याम और गैर-मौजूद बताने के साथ ही चौथी सीरीज़ को लाल और गैर-मौजूद बताया गया है. 

series: [
  {color: 'black', visibleInLegend: false}, {}, {},
  {color: 'red', visibleInLegend: false}
]
series: {
  0:{color: 'black', visibleInLegend: false},
  3:{color: 'red', visibleInLegend: false}
}
टाइप: ऑब्जेक्ट की कैटगरी या नेस्टेड ऑब्जेक्ट वाली ऑब्जेक्ट
डिफ़ॉल्ट: {}
theme

थीम, पहले से तय विकल्प वैल्यू का एक सेट होता है. इससे, किसी खास चार्ट के व्यवहार या विज़ुअल इफ़ेक्ट को एक साथ हासिल किया जा सकता है. फ़िलहाल, सिर्फ़ एक थीम उपलब्ध है:

  • 'बड़ा करें' - चार्ट के एरिया को बड़ा करता है और लेजेंड को और चार्ट के एरिया में मौजूद सभी लेबल को हासिल करता है. ये विकल्प सेट करता है: 
    chartArea: {width: '100%', height: '100%'},
legend: {position: 'in'},
titlePosition: 'in', axisTitlesPosition: 'in',
hAxis: {textPosition: 'in'}, vAxis: {textPosition: 'in'}
टाइप: स्ट्रिंग
डिफ़ॉल्ट: शून्य
शीर्षक

चार्ट के ऊपर दिखाया जाने वाला टेक्स्ट.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: कोई शीर्षक नहीं
titlePosition

चार्ट एरिया की तुलना में, चार्ट का शीर्षक कहां डालें. इस्तेमाल की जा सकने वाली वैल्यू:

  • में - चार्ट क्षेत्र के अंदर शीर्षक बनाएं.
  • आउट - चार्ट क्षेत्र के बाहर शीर्षक बनाएं.
  • कोई नहीं - शीर्षक हटा दें.
टाइप: स्ट्रिंग
डिफ़ॉल्ट: 'आउट'
शीर्षक टेक्स्ट स्टाइल

शीर्षक टेक्स्ट की शैली बताने वाला ऑब्जेक्ट. ऑब्जेक्ट का फ़ॉर्मैट ऐसा है:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }

color कोई भी एचटीएमएल कलर स्ट्रिंग हो सकती है, उदाहरण के लिए: 'red' या '#00cc00'. fontName और fontSize भी देखें.

टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
टूलटिप

कई टूलटिप एलिमेंट को कॉन्फ़िगर करने के लिए, ऑब्जेक्ट वाला ऑब्जेक्ट. इस ऑब्जेक्ट की प्रॉपर्टी तय करने के लिए, आप ऑब्जेक्ट लिटरल नोटेशन का इस्तेमाल कर सकते हैं, जैसा कि यहां दिखाया गया है: 

{textStyle: {color: '#FF0000'}, showColorCode: true}
टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: शून्य
टूलटिप.ध्यान न दें

अगर इसे true पर सेट किया जाता है, तो चार्ट के ड्रॉइंग को चार्ट के बाउंड की सीमा के बाहर फ़्लो करने की अनुमति मिलती है.

ध्यान दें: यह सिर्फ़ एचटीएमएल टूलटिप पर लागू होता है. अगर इसे SVG टूलटिप के साथ चालू किया जाता है, तो चार्ट की सीमाओं के बाहर मौजूद किसी भी ओवरफ़्लो को काट दिया जाएगा. ज़्यादा जानकारी के लिए, टूलटिप कॉन्टेंट को पसंद के मुताबिक बनाना देखें.

टाइप: बूलियन
डिफ़ॉल्ट: गलत
टूलटिप

अगर इस नीति को 'सही है' पर सेट किया जाता है, तो एचटीएमएल-रेंडर किया गया (SVG-रेंडरिंग के बजाय) टूलटिप का इस्तेमाल करें. ज़्यादा जानकारी के लिए, टूलटिप कॉन्टेंट को पसंद के मुताबिक बनाना देखें.

ध्यान दें: टूलटिप कॉलम डेटा भूमिका के ज़रिए, एचटीएमएल टूलटिप कॉन्टेंट को पसंद के मुताबिक बनाना बबल चार्ट विज़ुअलाइज़ेशन के साथ काम नहीं करता.

टाइप: बूलियन
डिफ़ॉल्ट: गलत
टूलटिप

अगर सही है, तो टूलटिप में सीरीज़ की जानकारी के बगल में, रंग वाले स्क्वेयर दिखाएं. focusTarget के 'कैटगरी' पर सेट होने पर, यह डिफ़ॉल्ट रूप से सही होता है. ऐसा न होने पर, डिफ़ॉल्ट वैल्यू 'गलत' होती है.

टाइप: बूलियन
डिफ़ॉल्ट: अपने-आप
टूलटिप

टूलटिप टेक्स्ट की स्टाइल के बारे में बताने वाला ऑब्जेक्ट. ऑब्जेक्ट का फ़ॉर्मैट ऐसा है:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }

color कोई भी एचटीएमएल कलर स्ट्रिंग हो सकती है, उदाहरण के लिए: 'red' या '#00cc00'. fontName और fontSize भी देखें.

टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
टूलटिप

जिस उपयोगकर्ता इंटरैक्शन की वजह से टूलटिप दिखता है:

  • 'फ़ोकस' - जब उपयोगकर्ता एलिमेंट पर कर्सर घुमाता है, तो टूलटिप दिखता है.
  • 'कोई नहीं' - टूलटिप नहीं दिखाया जाएगा.
  • 'चुना हुआ' - जब उपयोगकर्ता एलिमेंट चुनता है, तो टूलटिप दिखता है.
टाइप: स्ट्रिंग
डिफ़ॉल्ट: 'फ़ोकस'
ट्रेंडलाइन

उन्हें दिखाने वाले चार्ट पर ट्रेंडलाइन दिखाता है. डिफ़ॉल्ट तौर पर, लीनियर ट्रेंडलाइन इस्तेमाल की जाती हैं, लेकिन trendlines.n.type विकल्प की मदद से इसे पसंद के मुताबिक बनाया जा सकता है.

ट्रेंडलाइन, हर सीरीज़ के हिसाब से तय होती हैं. इसलिए, आम तौर पर आपके विकल्प कुछ इस तरह दिखेंगे: 

var options = {
  trendlines: {
    0: {
      type: 'linear',
      color: 'green',
      lineWidth: 3,
      opacity: 0.3,
      showR2: true,
      visibleInLegend: true
    }
  }
}
टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: शून्य
ट्रेंडलाइन.n.color

ट्रेंडलाइन का रंग, को अंग्रेज़ी रंग के नाम या हेक्स स्ट्रिंग के तौर पर दिखाया जाता है.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: सीरीज़ का डिफ़ॉल्ट रंग
ट्रेंडलाइन.n.डिग्री

type: 'polynomial' की ट्रेंडलाइन के लिए, पॉलिनोमियल की डिग्री (क्वाड्रेटिक के लिए 2, क्यूबिक के लिए 3, वगैरह). (Google चार्ट के आने वाले वर्शन में डिफ़ॉल्ट डिग्री को तीन से दो पर बदला जा सकता है.)

टाइप: नंबर
डिफ़ॉल्ट: 3
ट्रेंडलाइन.n.labelInLegend

अगर यह सेट है, तो ट्रेंडलाइन , लेजेंड में इस स्ट्रिंग के तौर पर दिखेगी.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: शून्य
ट्रेंडलाइन.n.lineWidth

पिक्सल में, ट्रेंडलाइन की लाइन की चौड़ाई.

टाइप: नंबर
डिफ़ॉल्ट: 2
ट्रेंडलाइन.n.opacity

ट्रेंडलाइन के बारे में जानकारी, 0.0 (पारदर्शी) से 1.0 (पारदर्शी) तक.

टाइप: नंबर
डिफ़ॉल्ट: 1.0
ट्रेंडलाइन.n.pointSize

ट्रेंडलाइन को चुनने के लिए, चार्ट पर बहुत से बिंदुओं पर मोहर लगाई जाती है. हालांकि, इसकी ज़रूरत शायद ही पड़ती हो, लेकिन डॉट के साइज़ को अपनी पसंद के मुताबिक बनाया जा सके. ट्रेंडलाइन का lineWidth विकल्प आम तौर पर बेहतर होगा. हालांकि, अगर आप ग्लोबल pointSize विकल्प का इस्तेमाल कर रहे हैं और अपने ट्रेंडलाइन के लिए अलग पॉइंट साइज़ चाहते हैं, तो आपको इस विकल्प की ज़रूरत होगी.

टाइप: नंबर
डिफ़ॉल्ट: 1
ट्रेंडलाइन.n.पॉइंट दिखने की सुविधा

ट्रेंडलाइन को चार्ट पर कई बिंदुओं पर स्टैंप लगाकर, तय किया जाता है. ट्रेंडलाइन का pointsVisible विकल्प तय करता है कि किसी खास ट्रेंडलाइन के पॉइंट दिख रहे हैं या नहीं.

टाइप: बूलियन
डिफ़ॉल्ट: true
ट्रेंडलाइन.n.showR2

लेजेंड या ट्रेंडलाइन टूलटिप में तय किया गया गुणांक दिखाना है या नहीं.

टाइप: बूलियन
डिफ़ॉल्ट: गलत
ट्रेंडलाइन.n.type

चाहे ट्रेंडलाइन 'linear' (डिफ़ॉल्ट), 'exponential' या 'polynomial' हो.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: लीनियर
ट्रेंडलाइन.n.visibleInLegend

ट्रेंडलाइन लेजेंड, लेजेंड में दिखता है या नहीं. (यह ट्रेंडलाइन टूलटिप में दिखेगा.)

टाइप: बूलियन
डिफ़ॉल्ट: गलत
वैक्स

अगर चार्ट में एक से ज़्यादा वर्टिकल ऐक्सिस हैं, तो अलग-अलग वर्टिकल ऐक्सिस के लिए प्रॉपर्टी तय की जाएगी. हर चाइल्ड ऑब्जेक्ट एक vAxis ऑब्जेक्ट होता है और उसमें vAxis के साथ काम करने वाली सभी प्रॉपर्टी हो सकती हैं. ये प्रॉपर्टी की वैल्यू, एक ही प्रॉपर्टी के लिए किसी भी ग्लोबल सेटिंग को बदल देती हैं.

एक से ज़्यादा वर्टिकल ऐक्सिस वाले चार्ट बनाने के लिए, पहले series.targetAxisIndex का इस्तेमाल करके एक नया ऐक्सिस तय करें. इसके बाद, vAxes का इस्तेमाल करके ऐक्सिस को कॉन्फ़िगर करें. इस उदाहरण में, सीरीज़ 2 को दाएं ऐक्सिस से असाइन किया गया है. साथ ही, इसके लिए कस्टम शीर्षक और टेक्स्ट की स्टाइल तय की गई है: 

{
  series: {
    2: {
      targetAxisIndex:1
    }
  },
  vAxes: {
    1: {
      title:'Losses',
      textStyle: {color: 'red'}
    }
  }
}

यह प्रॉपर्टी, ऑब्जेक्ट या कलेक्शन हो सकती है: ऑब्जेक्ट, ऑब्जेक्ट का कलेक्शन है. हर ऑब्जेक्ट, संख्या वाला लेबल होता है. यह लेबल उस ऐक्सिस के बारे में बताता है जिसे वह तय करता है. -- ऊपर दिया गया फ़ॉर्मैट, कलेक्शन होता है. कलेक्शन, हर ऐक्सिस में एक ऑब्जेक्ट होता है. उदाहरण के लिए, श्रेणी के स्टाइल वाला यह नोटेशन, ऊपर दिखाए गए vAxis ऑब्जेक्ट से मिलता-जुलता है: 

vAxes: [
  {}, // Nothing specified for axis 0
  {
    title:'Losses',
    textStyle: {color: 'red'} // Axis 1
  }
]
टाइप: ऑब्जेक्ट की कैटगरी या चाइल्ड ऑब्जेक्ट के साथ ऑब्जेक्ट
डिफ़ॉल्ट: शून्य
वैक्सिस

अलग-अलग वर्टिकल ऐक्सिस के एलिमेंट कॉन्फ़िगर करने के लिए, सदस्यों वाला ऑब्जेक्ट. इस ऑब्जेक्ट की प्रॉपर्टी बताने के लिए, आप ऑब्जेक्ट लिटरल नोटेशन का इस्तेमाल कर सकते हैं, जैसा कि यहां दिखाया गया है: 

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}
टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: शून्य
वाक्सिस बेसलाइन

vAxis प्रॉपर्टी, जो वर्टिकल ऐक्सिस के लिए बेसलाइन तय करती है. अगर बेसलाइन सबसे ज़्यादा ग्रिड लाइन से बड़ा या सबसे नीचे ग्रिड लाइन से छोटा है, तो इसे सबसे करीब की ग्रिडलाइन पर रखा जाएगा.

टाइप: नंबर
डिफ़ॉल्ट: अपने-आप
vAxis.baselineColor

वर्टिकल ऐक्सिस के लिए बेसलाइन का रंग बताता है. यह कोई भी एचटीएमएल कलर स्ट्रिंग हो सकती है, उदाहरण के लिए: 'red' या '#00cc00'.

टाइप: नंबर
डिफ़ॉल्ट: 'काला'
vAxis.direction

वह दिशा जिसमें वर्टिकल ऐक्सिस से वैल्यू बढ़ती हैं. डिफ़ॉल्ट रूप से, कम वैल्यू चार्ट के सबसे नीचे होती हैं. वैल्यू का क्रम उलटने के लिए, -1 बताएं.

टाइप: 1 या -1
डिफ़ॉल्ट: 1
vAxis.फ़ॉर्मैट

संख्या में ऐक्सिस लेबल के लिए एक फ़ॉर्मैट स्ट्रिंग. यह आईसीयू पैटर्न सेट का सबसेट है. उदाहरण के लिए, {format:'#,###%'}, 10, 7.5, और 0.5 की वैल्यू के लिए "1,000%", "750%", और "50%" वैल्यू दिखाएगा. इनमें से कोई भी जानकारी दी जा सकती है:

  • {format: 'none'}: फ़ॉर्मैट के बिना नंबर दिखाता है (जैसे, 8,00,00,000)
  • {format: 'decimal'}: विभाजकों की संख्या दिखाता है (उदाहरण, 80,00,000)
  • {format: 'scientific'}: वैज्ञानिक अंकन में संख्याएं दिखाता है (उदाहरण के लिए, 8e6)
  • {format: 'currency'}: स्थानीय मुद्रा में नंबर दिखाता है (उदाहरण, 80,00,000.00 डॉलर
  • {format: 'percent'}, संख्याओं को प्रतिशत के रूप में दिखाता है (उदाहरण, 8,00,00,000%)
  • {format: 'short'}: छोटे फ़ोन नंबर दिखाता है (उदाहरण के लिए, 80 लाख)
  • {format: 'long'}: संख्याओं को पूरे शब्दों के रूप में दिखाता है (उदाहरण, 80 लाख)

लेबल पर लागू की गई असल फ़ॉर्मैटिंग उस जगह से ली जाती है जहां एपीआई लोड किया गया है. ज़्यादा जानकारी के लिए, खास जगह के साथ चार्ट लोड करना देखें.

टिक वैल्यू और ग्रिडलाइन का हिसाब लगाने के लिए, मिलते-जुलते सभी ग्रिडलाइन विकल्पों के कई दूसरे कॉम्बिनेशन को ध्यान में रखा जाएगा. साथ ही, अगर चुने गए टिक लेबल के डुप्लीकेट या ओवरलैप होंगे, तो उनके विकल्पों को अस्वीकार कर दिया जाएगा. अगर आपको सिर्फ़ पूर्णांक टिक वैल्यू दिखानी है, तो format:"#" तय करें. हालांकि, ध्यान रखें कि अगर कोई विकल्प इस स्थिति के हिसाब से नहीं है, तो ग्रिडलाइन या टिक नहीं दिखेंगे.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: अपने-आप
वैक्सिस ग्रिड्लिक्स

वर्टिकल ऐक्सिस पर ग्रिडलाइन कॉन्फ़िगर करने के लिए, ऑब्जेक्ट रखने वाला ऑब्जेक्ट. ध्यान रखें कि वर्टिकल ऐक्सिस ग्रिडलाइन हॉरिज़ॉन्टल तौर पर बनाई गई होती हैं. इस ऑब्जेक्ट की प्रॉपर्टी बताने के लिए, आप ऑब्जेक्ट लिटरल नोटेशन का इस्तेमाल कर सकते हैं, जैसा कि यहां दिखाया गया है: 

{color: '#333', minSpacing: 20}
टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: शून्य
vAxis.gridlines.color

चार्ट एरिया में वर्टिकल ग्रिडलाइन का रंग. मान्य एचटीएमएल कलर स्ट्रिंग बताएं.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: '#CCC'
वैक्सिस.gridlines.count

चार्ट एरिया में हॉरिज़ॉन्टल ग्रिडलाइन की अनुमानित संख्या. अगर आप gridlines.count के लिए पॉज़िटिव नंबर डालते हैं, तो इसका इस्तेमाल ग्रिडलाइन के बीच minSpacing का हिसाब लगाने के लिए किया जाएगा. सिर्फ़ एक ग्रिडलाइन बनाने के लिए, 1 की वैल्यू तय की जा सकती है या कोई ग्रिडलाइन न बनाने के लिए, 0 की वैल्यू तय की जा सकती है. दूसरे विकल्पों के आधार पर, ग्रिडलाइन की संख्या अपने-आप कैलकुलेट करने के लिए, -1 तय करें. यह डिफ़ॉल्ट रूप से, इस्तेमाल किया जाता है.

टाइप: नंबर
डिफ़ॉल्ट: -1
vAxis.gridlines.interval

ग्रिडलाइन के बीच साइज़ की श्रेणी (डेटा वैल्यू के तौर पर, न कि पिक्सल). यह विकल्प, सिर्फ़ संख्या वाले ऐक्सिस के लिए है. हालांकि, यह gridlines.units.<unit>.interval के उन विकल्पों के जैसा ही है जिनका इस्तेमाल सिर्फ़ तारीखों और समय के लिए किया जाता है. लीनियर स्केल के लिए, डिफ़ॉल्ट [1, 2, 2.5, 5] है, जिसका मतलब है कि ग्रिडलाइन की वैल्यू हर यूनिट (1), ईवन यूनिट (2) या 2.5 या 5 के मल्टीपल पर हो सकती हैं. इन वैल्यू को 10 से गुणा करने पर मिलने वाली वैल्यू को भी [10, 20, 25, 50], और [.1, .2, .25, .5] में शामिल किया जाता है. लॉग स्केल के लिए, डिफ़ॉल्ट विकल्प [1, 2, 5] है.

टाइप: 1 से 10 के बीच की संख्या, जिसमें 10 शामिल नहीं हैं.
डिफ़ॉल्ट: कंप्यूट किया गया
vAxis.gridlines.minSpac

hAxis मेजर ग्रिडलाइन के बीच पिक्सल में कम से कम स्क्रीन स्पेस. बड़ी ग्रिडलाइनों के लिए डिफ़ॉल्ट विकल्प, 40 लीनियर स्केल के लिए और 20 लॉग स्केल के लिए है. अगर आप minSpacing के बजाय count को तय करते हैं, तो minS हैपर को गिनती से गिना जाता है. इसके उलट, अगर आप count के बजाय minSpacing बताते हैं, तो गिनती को कम से कम वैल्यू के आधार पर कैलकुलेट किया जाता है. दोनों को तय करने पर, minSpacing बदल जाता है.

टाइप: नंबर
डिफ़ॉल्ट: कंप्यूट किया गया
CANNOT TRANSLATE

सभी ग्रिडलाइन और टिक वैल्यू, इस विकल्प की वैल्यू के एक से ज़्यादा होने चाहिए. ध्यान दें कि 10 बार के अंतर को इंटरवल के उलट, गुणा करने के नतीजे नहीं माना जाता. इसलिए, आप gridlines.multiple = 1 तय करके टिक को पूर्णांक मानने के लिए कह सकते हैं या gridlines.multiple = 1000 बताकर टिक को 1000 के गुणांक में बदल सकते हैं.

टाइप: नंबर
डिफ़ॉल्ट: 1
वैक्सिस.gridlines.units

चार्ट के लिए कंप्यूट किए गए ग्रिडलाइन का इस्तेमाल करने पर, तारीख/तारीख और समय के अलग-अलग टाइप के डेटा के डिफ़ॉल्ट फ़ॉर्मैट को बदल देता है. साल, महीने, दिन, घंटे, मिनट, सेकंड, और मिलीसेकंड के लिए फ़ॉर्मैट करने की सुविधा देता है.

सामान्य फ़ॉर्मैट यह है:

gridlines: {
  units: {
    years: {format: [/*format strings here*/]},
    months: {format: [/*format strings here*/]},
    days: {format: [/*format strings here*/]},
    hours: {format: [/*format strings here*/]},
    minutes: {format: [/*format strings here*/]},
    seconds: {format: [/*format strings here*/]},
    milliseconds: {format: [/*format strings here*/]}
  }
}

तारीख और समय में, ज़्यादा जानकारी देखी जा सकती है.

टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: शून्य
वैक्सिस.minorGridlines

vAxis.gridlines विकल्प के समान, वर्टिकल अक्ष पर छोटी ग्रिडलाइन को कॉन्फ़िगर करने के लिए सदस्यों के साथ एक ऑब्जेक्ट.

टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: शून्य
vAxis.minorGridlines.रंग

चार्ट एरिया में वर्टिकल छोटी ग्रिडलाइन का रंग. एचटीएमएल रंग की मान्य स्ट्रिंग बताएं.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: ग्रिडलाइन और बैकग्राउंड के रंगों का ब्लेंड
vAxis.minorGridlines.count

माइनर ग्रिडलाइन.काउंट विकल्प को ज़्यादातर तब रोका जाता है, जब माइनर ग्रिडलाइन को 0 पर सेट करके इसे बंद नहीं किया जाता है. छोटी ग्रिडलाइन की संख्या, बड़ी ग्रिडलाइन (vAxis.gridlines.interval) और कम से कम ज़रूरी खाली जगह (vAxis.minorGridlines.minSpac) को देखें.

टाइप: नंबर
डिफ़ॉल्ट: 1
vAxis.minorGridlines.interval

थोड़ा ग्रिडलाइन.इंटरवल विकल्प, मेजर ग्रिडलाइन इंटरवल विकल्प की तरह है. हालांकि, चुना गया इंटरवल हमेशा प्रमुख ग्रिडलाइन इंटरवल के बराबर होगा. लीनियर स्केल का डिफ़ॉल्ट इंटरवल [1, 1.5, 2, 2.5, 5] है और लॉग स्केल के लिए [1, 2, 5] है.

टाइप: नंबर
डिफ़ॉल्ट:1
vAxis.minorGridlines.minSpac

सबसे छोटी ज़रूरी जगह, पिक्सल में, छोटी छोटी ग्रिडलाइन के बीच, और छोटी और बड़ी ग्रिडलाइन के बीच. डिफ़ॉल्ट वैल्यू, लीनियर स्केल के लिए बड़ी ग्रिडलाइनों की 1/2 मिनट की दूरी और लॉग स्केल के लिए 1/5 मिनट की स्पेसिंग है.

टाइप: नंबर
डिफ़ॉल्ट:हिसाब लगाया गया
vAxis.minorGridlines.एक

gridlines.multiple की तरह.

टाइप: नंबर
डिफ़ॉल्ट: 1
vAxis.minorGridlines.units

चार्ट कंप्यूट माइनर ग्रिडलाइन के साथ इस्तेमाल किए जाने पर, तारीख/तारीख/समयका डेटा टाइप के अलग-अलग पहलुओं के लिए डिफ़ॉल्ट फ़ॉर्मैट को बदल देता है. साल, महीने, दिन, घंटे, मिनट, सेकंड, और मिलीसेकंड के लिए फ़ॉर्मैट करने की सुविधा देता है.

सामान्य फ़ॉर्मैट यह है:

gridlines: {
  units: {
    years: {format: [/*format strings here*/]},
    months: {format: [/*format strings here*/]},
    days: {format: [/*format strings here*/]}
    hours: {format: [/*format strings here*/]}
    minutes: {format: [/*format strings here*/]}
    seconds: {format: [/*format strings here*/]},
    milliseconds: {format: [/*format strings here*/]},
  }
}

तारीख और समय में, ज़्यादा जानकारी देखी जा सकती है.

टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: शून्य
vAxis.logScale

सही होने पर, वर्टिकल ऐक्सिस से लॉगारिद्मिक स्केल बनता है. ध्यान दें: सभी वैल्यू पॉज़िटिव होनी चाहिए.

टाइप: बूलियन
डिफ़ॉल्ट: गलत
vAxis.ScaleType

vAxis प्रॉपर्टी, जो वर्टिकल ऐक्सिस को लॉगरिद्मिक स्केल बनाती है. इनमें से कोई एक हो सकता है:

  • शून्य - लॉगरिद्मिक स्केलिंग नहीं की जाती.
  • 'log' - लॉगरिद्मिक स्केलिंग. शून्य और शून्य मान नहीं दिखाए जाते. यह विकल्प, vAxis: { logscale: true } को सेट करने जैसा ही है.
  • 'MirrorLog' - लॉगारिद्मिक स्केलिंग जिसमें नेगेटिव और शून्य मान प्लॉट किए जाते हैं. नेगेटिव संख्या का प्लॉट की गई वैल्यू, निरपेक्ष वैल्यू के लॉग का नेगेटिव होता है. शून्य के करीब की वैल्यू को लीनियर स्केल पर दिखाया जाता है.

यह विकल्प सिर्फ़ continuous ऐक्सिस पर काम करता है.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: शून्य
vAxis.textPosition

चार्ट के एरिया के हिसाब से, वर्टिकल ऐक्सिस पर टेक्स्ट की जगह. इस्तेमाल की जा सकने वाली वैल्यू: 'out', 'in', 'none'.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: 'आउट'
vAxis.textStyle

ऐसा ऑब्जेक्ट जो वर्टिकल ऐक्सिस के टेक्स्ट की स्टाइल बताता है. ऑब्जेक्ट का फ़ॉर्मैट ऐसा है:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }

color कोई भी एचटीएमएल कलर स्ट्रिंग हो सकती है, उदाहरण के लिए: 'red' या '#00cc00'. fontName और fontSize भी देखें.

टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
वैक्सिस

अपने-आप जनरेट होने वाले Y-ऐक्सिस टिक को, तय की गई श्रेणी से बदल देता है. श्रेणी का हर एलिमेंट एक मान्य टिक वैल्यू होना चाहिए (जैसे कि कोई संख्या, तारीख, तारीख या दिन का समय) या कोई ऑब्जेक्ट. अगर यह कोई ऑब्जेक्ट है, तो इसमें टिक वैल्यू के लिए v प्रॉपर्टी होनी चाहिए. साथ ही, एक वैकल्पिक f प्रॉपर्टी होनी चाहिए, जिसमें लिटरल स्ट्रिंग लेबल के तौर पर दिखे.

व्यू विंडो को अपने-आप बड़ा और छोटा करने के लिए, बड़ा करके दिखाया जाता है. ऐसा तब तक किया जाता है, जब तक आप viewWindow.min या viewWindow.max को ओवरराइड नहीं करते.

उदाहरण:

  • vAxis: { ticks: [5,10,15,20] }
  • vAxis: { ticks: [{v:32, f:'thirty two'}, {v:64, f:'sixty four'}] }
  • vAxis: { ticks: [new Date(2014,3,15), new Date(2013,5,15)] }
  • vAxis: { ticks: [16, {v:32, f:'thirty two'}, {v:64, f:'sixty four'}, 128] }
टाइप: एलिमेंट की कैटगरी
डिफ़ॉल्ट: अपने-आप
वैक्सिस टाइटल

vAxis प्रॉपर्टी, जो वर्टिकल ऐक्सिस के लिए शीर्षक तय करती है.

टाइप: स्ट्रिंग
डिफ़ॉल्ट: कोई शीर्षक नहीं
vAxis.titleTextStyle

ऐसा ऑब्जेक्ट जो वर्टिकल ऐक्सिस शीर्षक के टेक्स्ट की स्टाइल बताता है. ऑब्जेक्ट का फ़ॉर्मैट ऐसा है:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }

color कोई भी एचटीएमएल कलर स्ट्रिंग हो सकती है, उदाहरण के लिए: 'red' या '#00cc00'. fontName और fontSize भी देखें.

टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
वैक्सी.मैक्स वैल्यू

वर्टिकल ऐक्सिस के मान को तय की गई वैल्यू पर ले जाता है. ज़्यादातर चार्ट में यह ऊपर की तरफ़ होता है. अगर यह डेटा के ज़्यादा से ज़्यादा y-मान से कम मान पर सेट है, तो अनदेखा किया गया. vAxis.viewWindow.max, इस प्रॉपर्टी को बदल देता है.

टाइप: नंबर
डिफ़ॉल्ट: अपने-आप
vAxis.minValue

वर्टिकल ऐक्सिस के मान को तय की गई वैल्यू पर ले जाता है. ज़्यादातर चार्ट में यह सबसे नीचे की ओर होगा. अगर यह डेटा के कम से कम y-मान से ज़्यादा मान पर सेट है, तो अनदेखा कर दिया जाता है. vAxis.viewWindow.min, इस प्रॉपर्टी को बदल देता है.

टाइप: नंबर
डिफ़ॉल्ट: शून्य
vAxis.viewwindowMode

चार्ट के क्षेत्र में वैल्यू को रेंडर करने के लिए वर्टिकल ऐक्सिस को स्केल करने का तरीका बताता है. स्ट्रिंग की इन वैल्यू का इस्तेमाल किया जा सकता है:

  • 'प्रिटी' - वर्टिकल वैल्यू को स्केल करें, ताकि कम से कम और कम से कम डेटा वैल्यू, चार्ट के निचले और सबसे ऊपर के हिस्से में रेंडर की जा सकें. Viewविंडो को संख्याओं के लिए निकटतम मेजर ग्रिडलाइन या तारीख और समय के लिए निकटतम छोटी ग्रिडलाइन के लिए विस्तृत किया जाता है.
  • 'ज़्यादा से ज़्यादा' - वर्टिकल वैल्यू को स्केल करें, ताकि ज़्यादा से ज़्यादा और कम से कम डेटा वैल्यू, चार्ट के एरिया के ऊपर और नीचे को छू सकें. ऐसा करने पर, vaxis.viewWindow.min और vaxis.viewWindow.max को अनदेखा कर दिया जाएगा.
  • 'अश्लील' - चार्ट में सबसे ऊपर और सबसे नीचे की वैल्यू की वैल्यू बताने का विकल्प बंद कर दिया गया है. (इसका इस्तेमाल अब नहीं किया जाता है, क्योंकि यह vaxis.viewWindow.min और vaxis.viewWindow.max के साथ ग़ैर-ज़रूरी है). इन वैल्यू से बाहर की डेटा वैल्यू को काटा जाएगा. आपको vAxis.viewWindow ऑब्जेक्ट के बारे में बताना होगा. इसमें, यह बताया जा सकता है कि 'ज़्यादा से ज़्यादा' और 'कम से कम' वैल्यू क्या दिखाने हैं.
टाइप: स्ट्रिंग
डिफ़ॉल्ट: यह ' बहुत सुंदर' के बराबर है, लेकिन इस्तेमाल किए जाने पर vaxis.viewWindow.min और vaxis.viewWindow.max को प्राथमिकता दी जाती है.
vAxis.viewविंडो

वर्टिकल ऐक्सिस की क्रॉपिंग रेंज के बारे में बताता है.

टाइप: ऑब्जेक्ट
डिफ़ॉल्ट: शून्य
CANNOT TRANSLATE

रेंडर करने के लिए ज़्यादा से ज़्यादा वर्टिकल डेटा वैल्यू.

vAxis.viewWindowMode को ' सुंदर' या 'ज़्यादा से ज़्यादा किया गया' होने पर अनदेखा किया जाता है.

टाइप: नंबर
डिफ़ॉल्ट: अपने-आप
vAxis.viewwindow.min

रेंडर करने के लिए कम से कम वर्टिकल डेटा.

vAxis.viewWindowMode को ' सुंदर' या 'ज़्यादा से ज़्यादा किया गया' होने पर अनदेखा किया जाता है.

टाइप: नंबर
डिफ़ॉल्ट: अपने-आप
width

चार्ट की चौड़ाई, पिक्सल में.

टाइप: नंबर
डिफ़ॉल्ट: शामिल एलिमेंट की चौड़ाई

तरीके

तरीका
draw(data, options)

चार्ट ड्रॉ करता है. चार्ट में, readyइवेंट के चालू होने के बाद ही दूसरे तरीके से कॉल किए जा सकते हैं. Extended description.

सामान लौटाने का टाइप: कोई नहीं
getAction(actionID)

अनुरोध की गई actionID के साथ टूलटिप कार्रवाई ऑब्जेक्ट दिखाता है.

सामान लौटाने का टाइप: ऑब्जेक्ट
getBoundingBox(id)

चार्ट एलिमेंट की बाईं, ऊपर, चौड़ाई, और ऊंचाई वाले ऑब्जेक्ट को दिखाता है id. id के फ़ॉर्मैट को अभी तक दस्तावेज़ में शामिल नहीं किया गया है (ये इवेंट हैंडलर की रिटर्न वैल्यू हैं), लेकिन यहां कुछ उदाहरण दिए गए हैं:

var cli = chart.getChartLayoutInterface();

चार्ट एरिया की ऊंचाई
cli.getBoundingBox('chartarea').height
किसी बार या कॉलम चार्ट की पहली सीरीज़ में तीसरे बार की चौड़ाई
cli.getBoundingBox('bar#0#2').width
पाई चार्ट की पांचवीं खूंटी (वेज) वाला बॉक्स
cli.getBoundingBox('slice#4')
किसी वर्टिकल (उदाहरण, कॉलम) चार्ट के चार्ट डेटा के चारों ओर मौजूद बॉक्स:
cli.getBoundingBox('vAxis#0#gridline')
हॉरिज़ॉन्टल (उदाहरण के लिए, बार) चार्ट के चार्ट डेटा के चारों ओर मौजूद बॉक्स:
cli.getBoundingBox('hAxis#0#gridline')

वैल्यू, चार्ट के कंटेनर के हिसाब से होती हैं. इसे चार्ट बनाने के बाद कॉल करें.

सामान लौटाने का टाइप: ऑब्जेक्ट
getChartAreaBoundingBox()

चार्ट कॉन्टेंट के बाएं, ऊपर, चौड़ाई, और ऊंचाई वाले ऑब्जेक्ट को दिखाता है (यानी, लेबल और लेजेंड को छोड़कर):

var cli = chart.getChartLayoutInterface();

cli.getChartAreaBoundingBox().left
cli.getChartAreaBoundingBox().top
cli.getChartAreaBoundingBox().height
cli.getChartAreaBoundingBox().width

वैल्यू, चार्ट के कंटेनर के हिसाब से होती हैं. इसे चार्ट बनाने के बाद कॉल करें.

सामान लौटाने का टाइप: ऑब्जेक्ट
getChartLayoutInterface()

ऑब्जेक्ट को चार्ट के ऑनस्क्रीन प्लेसमेंट और उसके एलिमेंट के बारे में जानकारी देता है.

दिए गए ऑब्जेक्ट पर, इन तरीकों को कॉल किया जा सकता है:

  • getBoundingBox
  • getChartAreaBoundingBox
  • getHAxisValue
  • getVAxisValue
  • getXLocation
  • getYLocation

इसे चार्ट बनाने के बाद कॉल करें.

सामान लौटाने का टाइप: ऑब्जेक्ट
getHAxisValue(xPosition, optional_axis_index)

xPosition पर मौजूद हॉरिज़ॉन्टल डेटा वैल्यू दिखाता है, जो चार्ट कंटेनर के बाएं किनारे से पिक्सल ऑफ़सेट होता है. नकारात्मक हो सकती है.

उदाहरण: chart.getChartLayoutInterface().getHAxisValue(400).

इसे चार्ट बनाने के बाद कॉल करें.

सामान लौटाने का टाइप: नंबर
getImageURI()

चार्ट को चित्र यूआरआई के रूप में क्रमांकित करता है.

इसे चार्ट बनाने के बाद कॉल करें.

PNG चार्ट प्रिंट करना देखें.

सामान लौटाने का टाइप: स्ट्रिंग
getSelection()

चुनी गई चार्ट इकाइयों की श्रेणी दिखाता है. बार, लेजेंड एंट्री और कैटगरी, चुनी जा सकती हैं. बार, डेटा टेबल में मौजूद किसी सेल से जुड़ा होता है और कॉलम में लेजेंड एंट्री (पंक्ति इंडेक्स शून्य होती है) और किसी पंक्ति की कैटगरी (कॉलम इंडेक्स शून्य होती है) होती है. इस चार्ट के लिए, किसी भी समय सिर्फ़ एक इकाई को चुना जा सकता है. Extended description .

लौटाए गए आइटम का टाइप: चुने गए एलिमेंट की कैटगरी
getVAxisValue(yPosition, optional_axis_index)

वर्टिकल डेटा वैल्यू yPosition पर दिखाता है. यह चार्ट कंटेनर के सबसे ऊपरी किनारे से नीचे की ओर, पिक्सल ऑफ़सेट होता है. नकारात्मक हो सकती है.

उदाहरण: chart.getChartLayoutInterface().getVAxisValue(300).

इसे चार्ट बनाने के बाद कॉल करें.

सामान लौटाने का टाइप: नंबर
getXLocation(dataValue, optional_axis_index)

चार्ट के कंटेनर के बाएं किनारे के मुकाबले dataValue का पिक्सल x-कोऑर्डिनेट दिखाता है.

उदाहरण: chart.getChartLayoutInterface().getXLocation(400).

इसे चार्ट बनाने के बाद कॉल करें.

सामान लौटाने का टाइप: नंबर
getYLocation(dataValue, optional_axis_index)

चार्ट के कंटेनर के ऊपरी किनारे की तुलना में dataValue का पिक्सल y-कोऑर्डिनेट दिखाता है.

उदाहरण: chart.getChartLayoutInterface().getYLocation(300).

इसे चार्ट बनाने के बाद कॉल करें.

सामान लौटाने का टाइप: नंबर
removeAction(actionID)

अनुरोध किए गए actionID से टूलटिप कार्रवाई को हटा देता है.

सामान लौटाने का टाइप: none
setAction(action)

जब उपयोगकर्ता कार्रवाई के टेक्स्ट पर क्लिक करता है, तो होने वाली कार्रवाई के लिए एक टूलटिप सेट करता है.

setAction का तरीका, ऑब्जेक्ट को उसके कार्रवाई पैरामीटर के तौर पर लेता है. इस ऑब्जेक्ट में तीन प्रॉपर्टी होनी चाहिए: id— सेट की जा रही कार्रवाई का आईडी text, वह टेक्स्ट जिसे कार्रवाई के लिए टूलटिप में दिखना चाहिए और action वह फ़ंक्शन जो उपयोगकर्ता के कार्रवाई टेक्स्ट पर क्लिक करने पर चलता है.

चार्ट के draw() तरीके को कॉल करने से पहले, सभी और सभी टूलटिप कार्रवाइयां सेट कर दी जानी चाहिए. ज़्यादा जानकारी.

सामान लौटाने का टाइप: none
setSelection()

चार्ट की दी गई इकाइयों को चुनें. पहले चुने गए को रद्द करता है. बार, लेजेंड एंट्री और कैटगरी, चुनी जा सकती हैं. बार, डेटा टेबल में मौजूद किसी सेल से जुड़ा होता है और कॉलम में लेजेंड एंट्री (पंक्ति इंडेक्स शून्य होती है) और किसी पंक्ति की कैटगरी (कॉलम इंडेक्स शून्य होती है) होती है. इस चार्ट के लिए, एक बार में सिर्फ़ एक इकाई को चुना जा सकता है. Extended description .

सामान लौटाने का टाइप: कोई नहीं
clearChart()

चार्ट साफ़ करता है और अपने सभी आवंटित संसाधन रिलीज़ करता है.

सामान लौटाने का टाइप: कोई नहीं

इवेंट

इन इवेंट को इस्तेमाल करने के तरीके के बारे में ज़्यादा जानने के लिए, बुनियादी इंटरैक्शन, इवेंट मैनेज करना, और इवेंट सक्रिय करना देखें.

नाम
animationfinish

ट्रांज़िशन ऐनिमेशन पूरा होने पर सक्रिय होता है.

प्रॉपर्टी: कोई नहीं
click

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

प्रॉपर्टी: targetID
error

जब चार्ट को रेंडर करते समय कोई गड़बड़ी होती है, तब सक्रिय किया जाता है.

प्रॉपर्टी: आईडी, मैसेज
legendpagination

जब उपयोगकर्ता, लेजेंड वाले पेजों पर क्लिक करते हैं, तो यह टैग सक्रिय होता है. लेजेंड के मौजूदा नंबर पर, पेज के इंडेक्स और पेजों की कुल संख्या को दिखाता है.

प्रॉपर्टी: currentPageइंडेक्स, totalPage
onmouseover

तब सक्रिय होता है, जब उपयोगकर्ता किसी विज़ुअल इकाई पर माउस ले जाता है. इससे, संबंधित डेटा टेबल एलिमेंट की पंक्ति और कॉलम इंडेक्स पास हो जाते हैं.

प्रॉपर्टी: पंक्ति, कॉलम
onmouseout

तब सक्रिय होता है, जब उपयोगकर्ता माउस का इस्तेमाल करके, विज़ुअल इकाई से दूर चला जाता है. इससे, इससे जुड़े डेटा टेबल एलिमेंट की लाइन और कॉलम के इंडेक्स पास होते हैं.

प्रॉपर्टी: पंक्ति, कॉलम
ready

चार्ट, मेथड कॉल के लिए तैयार है. चार्ट बनाने के बाद, अगर आपको चार्ट और इंटरैक्ट करने के तरीकों से इंटरैक्ट करना है, तो draw तरीके को कॉल करने से पहले, आपको इस इवेंट के लिए लिसनर सेट अप करना चाहिए. साथ ही, इवेंट चालू होने के बाद ही उन्हें कॉल करना चाहिए.

प्रॉपर्टी: कोई नहीं
select

तब सक्रिय होता है, जब उपयोगकर्ता किसी विज़ुअल इकाई पर क्लिक करता है. अगर आपको चुना गया है, तो यह जानने के लिए getSelection() को कॉल करें.

प्रॉपर्टी: कोई नहीं

डेटा नीति

सभी कोड और डेटा को ब्राउज़र में प्रोसेस किया जाता है और रेंडर किया जाता है. किसी भी सर्वर पर डेटा नहीं भेजा जाता.