Add a new Y scale in google chart - Javascript Google Chart

Javascript examples for Google Chart:Chart Configuration

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

Description

Add a new Y scale in google chart

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> 
      <script type="text/javascript">
    window.onload=function(){/*  ww w.  j  a v a 2  s. c  o  m*/
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
    ['Week', 'IE/Week',{ role: 'style' }, { role: 'annotation' }, { role: 'style' }, 'IE/Day', { role: 'style' }, { role: 'annotation' }],
    [ Math.random(),  Math.random(), '#5A9AD4',Math.random(), '#000000', Math.random(), '#ED7D30', Math.random()],
    [ Math.random(),  Math.random(), '#5A9AD4',Math.random(), '#000000', Math.random(), '#ED7D30', Math.random()],
    [ Math.random(),  Math.random(), '#5A9AD4',Math.random(), '#000000', Math.random(), '#ED7D30', Math.random()],
    [ Math.random(),  Math.random(), '#5A9AD4',Math.random(), '#000000', Math.random(), '#ED7D30', Math.random()],
    [ Math.random(),  Math.random(), '#5A9AD4',Math.random(), '#000000', Math.random(), '#ED7D30', Math.random()]
    ]);
var options = {
  annotations: {
    textStyle: {
      fontSize: 16,
      bold: true,
      color: 'black'
  }
},
title : 'IE Trends Weekly and Daily',
titleTextStyle: {color: 'black', fontName: 'Arial', fontSize: '18', fontWidth: 'normal'},
vAxes: { 0: {logScale: false}, 1: {logScale: false}},
vAxes: { 1: {logScale: false}, 2: {logScale: false}},
series:{
    titleTextStyle: {color: 'black'},
    0: { type: 'bar', targetAxisIndex:0},
    1: { type: 'line', targetAxisIndex:1}
},
pointSize:8,
color: 'black',
lineWidth: 2,
hAxis: {title: ''},
seriesType: 'bars'
};
var chart = new google.visualization.ComboChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
    }

      </script> 
   </head> 
   <body> 
      <div id="chart_div"></div>  
   </body>
</html>

Related Tutorials