How to replace Google Image Charts with Open Source
Get Started
This guide describes how to replace Google Image Charts with a free, open-source replacement. QuickChart is mostly compatible with Google Image Charts and serves as a drop-in replacement.
Here are a few things you should know before getting started:
- QuickChart is an open-source service that renders static chart images compatible with Google Image Charts. You can host your own server from source code or a Docker container, or you can use the reliable QuickChart.io web service and not worry about hosting.
- This page is for people looking to replace existing Google Image Charts implementations. To start from scratch with QuickChart, go to the main documentation.
- If you're starting fresh, use the open-source Chart.js format instead of Google Image Charts format. It's more flexible, has a strong community, and will never be deprecated.
Migrating from Google Image Charts
Replace chart.googleapis.com with quickchart.io in the URL.
For example, the URL:
https://chart.googleapis.com/chart?cht=bvg&chs=300x200&chd=t:5,5,5|10,10,10|15,15,15&chco=4d89f9,c6d9fd,00B88A&chds=0,20&chbh=a&chxs=0,000000,0,0,_&chxt=y&chm=N,000000,0,,10|N,000000,1,,10|N,000000,2,,10
Google Image Charts
Should be changed to:
https://quickchart.io/chart?cht=bvg&chs=300x200&chd=t:5,5,5|10,10,10|15,15,15&chco=4d89f9,c6d9fd,00B88A&chds=0,20&chbh=a&chxs=0,000000,0,0,_&chxt=y&chm=N,000000,0,,10|N,000000,1,,10|N,000000,2,,10
QuickChart equivalent
Supported Parameters
The most common Google Image Charts parameters are supported. The implementation of each parameter matches the Google Image Charts implementation as closely as possible.
| Parameter | Description and Syntax | Chart Types |
|---|---|---|
| cht | Chart type | Required for all charts |
| chd | Chart data string | Required for all charts |
| chs | Chart size | All charts |
| chdl, chdlp, chdls | Chart legend text and style | All charts |
| chf | Chart fill | All charts |
| chco | Series color | All charts |
| chg | Chart grid lines | Bar, Line |
| chl | Data labels | Bar, Line, Pie |
| chm | Text and Data Value Markers | Bar, Line |
| chxt | Visible axes | Bar, Line |
| chtt, chts | Chart title and style | All charts |
| chxr | Axis ranges | Bar, Line |
| chxl | Axis labels | Bar, Line |
| chxs | Axis label styles | Bar, Line |
tip
Missing a parameter, or need more customization options? Don't get locked into a proprietary format. See the main documentation to use the more powerful open-source Chart.js format.