Dual-Y Example

An example of a Google Dual-Y Column Chart.

HTML

<script type="text/javascript" src="https://www.google.com/jsapi?autoload={'modules':[{'name':'visualization','version':'1.1','packages':['bar']}]}"></script>
    <div id="columnchart_material" style="width: 900px; height: 500px;"></div>

JavaScript

google.load("visualization", "1.1", {packages:["bar"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Year', 'Português', 'Matemática', 'Escrita', 'Leitura'],
          ['1º ano', 'Básico' , 'Avançado', 'Proficiente', 'Abaixo do Básico'],
          ['2º ano', 'Proficiente' , 'Básico', 'Avançado', 'Abaixo do Básico']
        ]);

        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, options);
      }