Server-side image rendering for Google Charts

480 views
Skip to first unread message

Ian Webster

unread,
Jun 24, 2020, 4:43:23 PM6/24/20
to Google Visualization API
Hi all,

I am writing to announce the release of an open-source project Google Charts Node that renders Google Charts as an image.

This may be useful in cases where you can't display charts in a browser client (e.g. email or reports), or if you want to save images but are using chart types that don't support getImageURI.

GoogleChartsNode can be used as either a node.js library or a web API.   It uses a headless Chromium browser to render images.  Here's an example usage as a library:

const GoogleChartsNode = require('google-charts-node');

// Define your chart drawing function
function drawChart() {
  // ...
  const chart = new google.visualization.BarChart(container);
  chart.draw(data, options);
}

// Render the chart to image
const image = await GoogleChartsNode.render(drawChart, {
  width: 400,
  height: 300,
});

Because it uses Google's Javascript libraries to render, results are the same as regular Javascript Google Charts:

render.png
gauge.png

For those not using Javascript, you can host the project as a web server (container support pending if there's interest) and invoke it from your application.  Or, you can use the hosted version, which is running on Google Cloud infrastructure.

Parameters:
  • code: Javascript contents of drawChart (required)
  • packages: Comma-separated list of Google Visualization packages to load (defaults to "corechart")
  • width: Width of chart canvas in pixels
  • height: Height of chart canvas in pixels
  • mapsApiKey:  Maps key for geochart and maps
For more complex charts, I recommend POSTing your parameters as JSON.



Feedback and improvements on this open-source project are welcome at the google-charts-node Github.

As a disclaimer, I'm a former Googler but this offering is open-source and not affiliated with Google.

Ian
Reply all
Reply to author
Forward
0 new messages