Hi all,
I am writing to announce the release of an open-source project Google
Charts Node <https://github.com/typpo/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:
[image: render.png]
[image: 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.
Endpoint (GET/POST): *https://quickchart.io/google-charts/render*
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.
Example chart image URL:
https://quickchart.io/google-charts/render?packages=timeline&code=...
<https://quickchart.io/google-charts/render?packages=timeline&code=%20%20%20%20%20%20%20%20var%20container%20=%20document.getElementById(%27timeline%27);var%20chart%20=%20new%20google.visualization.Timeline(container);var%20dataTable%20=%20new%20google.visualization.DataTable();dataTable.addColumn({%20type:%20%27string%27,%20id:%20%27President%27%20});dataTable.addColumn({%20type:%20%27date%27,%20id:%20%27Start%27%20});dataTable.addColumn({%20type:%20%27date%27,%20id:%20%27End%27%20});dataTable.addRows([[%20%27Washington%27,%20new%20Date(1789,%203,%2030),%20new%20Date(1797,%202,%204)%20],[%20%27Adams%27,%20%20%20%20%20%20new%20Date(1797,%202,%204),%20%20new%20Date(1801,%202,%204)%20],[%20%27Jefferson%27,%20%20new%20Date(1801,%202,%204),%20%20new%20Date(1809,%202,%204)%20]]);chart.draw(dataTable);>
Documentation:
https://quickchart.io/documentation/google-charts-image-server/
Feedback and improvements on this open-source project are welcome at the
google-charts-node
Github <https://github.com/typpo/google-charts-node>.
As a disclaimer, I'm a former Googler but this offering is open-source and
not affiliated with Google.
Ian
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion on the web visit
https://groups.google.com/d/msgid/google-visualization-api/e04e9bdf-6c21-4f9f-a8b3-4976e5cc9b3bn%40googlegroups.com.
