Cannot format series or error bars on chart.

23 views
Skip to first unread message

Bryan Maloney

unread,
Oct 25, 2019, 3:28:43 PM10/25/19
to Google Visualization API

I can't get a chart to format series or error bars. Here is my code, including HTML for the page.

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
  google.charts.load('current', {packages: ['corechart']});
  google.charts.setOnLoadCallback(drawChart);
</script>




<script type="text/javascript">
    google.setOnLoadCallback(drawYearRTWChart);
      function drawYearRTWChart() {
  var data = new google.visualization.DataTable();
  data.addColumn('string', 'Year');
  data.addColumn('number', 'No');
  data.addColumn('number', 'Yes');
  data.addColumn({type: 'number', role: 'interval'});
  data.addColumn({type: 'number', role: 'interval'});
  data.addColumn({type: 'number', role: 'interval'});
  data.addColumn({type: 'number', role: 'interval'});
  data.addRows([
['2008', 6.29079427586207, 5.53004236363636, 4.91851279080694, 7.6630757609172, 4.29108564356168, 6.76899908371104],
['2009', 6.33056162068965, 5.59932918181818, 4.94756008907601, 7.7135631523033, 4.34078874161122, 6.85786962202515],
['2010', 6.36912193103448, 5.66461586363636, 4.97537548680019, 7.76286837526878, 4.38666871833059, 6.94256300894214],
['2011', 6.40331965517241, 5.72198813636364, 4.99981525263915, 7.80682405770568, 4.42457236543755, 7.01940390728972],
['2012', 6.43474162068966, 5.7848505, 5.02180286047611, 7.8476803809032, 4.46696409036594, 7.10273690963406],
['2013', 6.33405214814815, 6.04326329166667, 4.81023394850437, 7.85787034779193, 4.80847287626715, 7.27805370706619],
['2014', 6.36448577777778, 6.106054375, 4.83021656500301, 7.89875499055254, 4.85041483410794, 7.36169391589206],
['2015', 6.39197285185185, 6.17330858333333, 4.8482258319037, 7.93571987180001, 4.89483067878091, 7.45178648788576],
['2016', 6.44155126923077, 6.22364036, 4.83023435255373, 8.05286818590781, 4.97582577696627, 7.47145494303373],
['2017', 6.64916204, 6.11223346153846, 4.97796432419019, 8.32035975580981, 4.88359678041364, 7.34087014266328]
  ]);

  var options = {
    hAxis: {
      title: 'Year',
    },
    vAxis: {
      title: 'Population (millions)',
      minValue: 0,
      viewWindow: {max:  8.4},
      gridlines: {
        color: 'transparent'
      }
    },
      seriesType: 'line',
    series: {
      0: {
        color: '#804488',
        pointSize: 5
      },
    series: {
      1: {
        color: '#ddaa33',
        pointSize: 5
      },
    },
    interval: {
      2: {
        'color': 'black',
        lineWidth: 1
      },
      3: {
        'color': 'black',
        'lineWidth': 1
      },
    },
      4: {
        'color': 'black',
        'lineWidth': 1
      },
      5: {
        'color': 'black',
        'lineWidth': 1
      },
    }  };
 
        var RTW_years= new google.visualization.ComboChart(document.getElementById('RTW_years'));
        RTW_years.draw(data, options);
      }
</script>


<table style="float:right; width: 50%; table-layout: fixed">
<caption>Difference between RTW and non-RTW states</caption>
<tbody>
<tr>
        <td style="text-align: center; width: 100%"></td>
</tr>
<tr>
        <td style="padding-bottom: 1em; text-align: center; width: 100%"><div id="RTW_years"></div></td>
</tr>

</tbody>
</table>

Reply all
Reply to author
Forward
Message has been deleted
0 new messages