Dual-Y Example
An example of a Google Dual-Y Line Chart.
HTML
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<button id="change-chart">Change to Classic</button>
<br>
<br>
<div id="chart_div"></div>
JavaScript
google.charts.load('current', {
'packages': ['line', 'corechart']
});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var button = document.getElementById('change-chart');
var chartDiv = document.getElementById('chart_div');
var data = new google.visualization.DataTable();
data.addColumn('date', 'Month');
data.addColumn('number', "Average Temperature");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average Hours of Daylight");
data.addColumn('number', "Average...