Customize google chart labels data outside center - Javascript Google Chart

Javascript examples for Google Chart:Chart Configuration

  1. HOME
  2. Javascript
  3. Google Chart
  4. Chart Configuration

Description

Customize google chart labels data outside center

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <script type="text/javascript">
    window.onload=function(){/*from  w  w  w.jav  a 2 s  .com*/
google.charts.load("current", {packages:["corechart"]});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
  var data = google.visualization.arrayToDataTable([
    ['Language', 'Speakers (in millions)'],
    ['Assamese', 13], ['Bengali', 83],
    ['Kannada', 38]
  ]);
  var options = {
    title: 'Indian Language Use',
    backgroundColor: 'transparent',
    legend: 'none',
    pieHole: 0.9,
    pieSliceText: 'none',
     legend: {
     position: 'labeled'
     }
  };
  var chart = new google.visualization.PieChart(document.getElementById('piechart'));
  chart.draw(data, options);
}
    }

      </script> 
   </head> 
   <body> 
      <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> 
      <div id="piechart" style="width: 900px; height: 500px;"></div>  
   </body>
</html>

Related Tutorials