CODEWITHSUNDEEP
javascripthtmlcsschartsgoogle-visualization
Mark Gifford
Mark Gifford

Reputation: 135

Google charts: points on line graph not showing

This should be a very quick answer but I've been playing around for an hour now and can't fix it. The points on my line graph aren't showing, when I inspect the point in dev tools I can see the fill-opacity is set to 0. If I manually set it to 1 it's visible but I cant find the option to set that in the script. Here's the code, what am I missing?

<script type="text/javascript">
        google.load('visualization', '1.1', {packages: ['line']});
        google.setOnLoadCallback(drawChart);

        function drawChart() {

          var data = new google.visualization.DataTable();
          data.addColumn('string', 'Month');
          data.addColumn('number', 'New York');
          data.addColumn('number', 'London');

          data.addRows([
            ["Jan", 10, 12],
            ["Feb", 19, 31],
            ["Mar", 80, 20],
            ["Apr", 43, 56],
            ["May", 18, 42],
            ["Jun", 62, 81],
          ]);

          var options = {
            height: 400, 
            colors: ["#2980b9", "ffa22c"],
            pointSize: 10,
            dataOpacity: 1.0,
          };

          var chart = new google.charts.Line(document.getElementById('linechart_material'));

          chart.draw(data, options);
        }
    </script>

Upvotes: 1

Views: 1696

Answers (1)

jamesolson
jamesolson

Reputation: 56

google.charts.Line is a reference to the newer Google Material Charts. From the docs:

The Material Charts are in beta. The appearance and interactivity are largely final, but the way options are declared is not.

Unfortunately, you can't set some options yet, see this open issue:

The pointSize option is not yet supported for Material Charts.

Upvotes: 4

Related Questions