title: Google Area Chart axis and setting full width
body: <p>I'm trying to style and add another 2 x'axis to a Google area chart (a and b in the image). For example, the <strong>a</strong> axis should be set to 900 and <strong>b</strong>: 700.</p>
  
  <p>Also trying to extend the chart to the full width of the containing div (960px) but my solution seems to do nothing.</p>
  
  <p><img src="https://i.stack.imgur.com/JvDNU.jpg" alt="This is the desired effect">
  <em>This is the desired effect.</em></p>
  
  <p><strong>Current js</strong></p>
  
  <pre><code>google.load("visualization", "1", {packages:["corechart"]});
    google.setOnLoadCallback(drawChart);
    function drawChart() {
      var data = google.visualization.arrayToDataTable([
        ['Year', 'Sales', 'Expenses'],
              ['November',  1000,      400],
              ['December',  1170,      460],
              ['January',  660,       1120],
              ['February',  690,       1120],
              ['March',  780,       1120],
              ['April',  820,       1120],
              ['May',  660,       1120],
              ['June',  1030,      540]
      ]);
  
      var options = {
        title: '',
        backgroundColor: 'none',
        width:'960',
        legend: {position: 'none'},
        hAxis: {title: 'Year',  titleTextStyle: {color: 'grey'},
        }
      };
  
      var chart = new google.visualization.AreaChart(document.getElementById('chart_div'));
      chart.draw(data, options);
    }
  </code></pre>