gchart

Google charts piechart Material design


I need to show data in several types of charts and I like the look and feel of the Material design charts over the default google charts. Linecharts and barcharts work nicely, however, a piechart does not seem to be available in Material design... Or at least.. I can't get it to work.

On this page, Google states that for every corechart, a Material design is available: https://developers.google.com/chart/interactive/docs/gallery/barchart

Creating Material bar charts In 2014, Google announced guidelines intended to support a common look and feel across its properties and apps (such as Android apps) that run on Google platforms. We call this effort Material Design. We'll be providing "Material" versions of all our core charts; you're welcome to use them if you like how they look.

Creating a Material Bar Chart is similar to creating what we'll now call a "Classic" Bar Chart. You load the Google Visualization API (although with the 'bar' package instead of the 'corechart' package), define your datatable, and then create an object (but of class google.charts.Bar instead of google.visualization.BarChart).

On the piechart page, Material design is not mentioned at all: https://developers.google.com/chart/interactive/docs/gallery/piechart

I have tried to draw the table as explained above, loading 'pie' instead of 'corechart' and loading 'google.charts.Pie' instead of 'google.visualization.PieChart'. This does not work.

Has anyone got a google piechart to work in Material design? Or is it really not available?


Solution

  • Add options theme in function drawChart()

      var options = {
         theme: 'material'
      };