Hi David, The graph that you linked is in my roadmap for the project, but you are using some more advanced features so it may take some time to complete the implementation. Google Image Charts is the product of years of work and it has some unusual bells and whistles...
In case you're interested, I took the liberty of converting your chart to Chart.js format. I prefer this format for complex graphs because it is easier to understand and quite well documented. Here is a link to the equivalent Chart.js specification for your chart: https://gist.github.com/typpo/f7ada53b1d2a3bf2ed0f1ff7446fc6f5. It produces this image <https://quickchart.io/chart?w=300&h=50&bkg=white&devicePixelRatio=1&c={%0A%20 type%3A 'line'%2C%0A%20 data%3A {%0A%20%20%20 labels%3A [''%2C''%2C''%2C''%2C'']%2C%0A%20%20%20 datasets%3A [{%0A%20%20%20%20%20 label%3A 'comments'%2C%0A%20%20%20%20%20 borderColor%3A 'blue'%2C%0A%20%20%20%20%20 yAxisID%3A 'A'%2C%0A%20%20%20%20%20 data%3A [0%2C1%2C1%2C1%2C2%2C3%2C4%2C4]%2C%0A%20%20%20%20%20 fill%3A false%2C%0A%20%20%20%20%20 borderWidth%3A 1%2C%0A%20%20%20 }%2C {%0A%20%20%20%20%20 label%3A 'retweets'%2C%0A%20%20%20%20%20 borderColor%3A 'green'%2C%0A%20%20%20%20%20 backgroundColor%3A '%23ff8c00'%2C%0A%20%20%20%20%20 pointBorderColor%3A '%23ff8c00'%2C%0A%20%20%20%20%20 yAxisID%3A 'B'%2C%0A%20%20%20%20%20 data%3A [80%2C261%2C357%2C475%2C501%2C514%2C527%2C535]%2C%0A%20%20%20%20%20 pointRadius%3A [0%2C0%2C5%2C0%2C0%2C0%2C0%2C0]%2C%0A%20%20%20%20%20 fill%3A false%2C%0A%20%20%20%20%20 borderWidth%3A 1%2C%0A%20%20%20 }]%0A%20 }%2C%0A%20 options%3A {%0A%20%20%20 legend%3A {%0A%20%20%20%20%20 position%3A 'right'%2C%0A%20%20%20%20%20 labels%3A {%0A%20%20%20%20%20%20%20 boxWidth%3A 5%2C%0A%20%20%20%20%20%20%20 fontSize%3A 8%2C%0A%20%20%20%20%20%20%20 padding%3A 5%2C%0A%20%20%20%20%20 }%2C%0A%20%20%20 }%2C%0A%20%20%20 layout%3A {%0A%20%20%20%20%20 padding%3A {%20%0A%20%20%20%20%20%20%20 bottom%3A -20%2C%0A%20%20%20%20%20 }%0A%20%20%20 }%2C%0A%20%20%20 elements%3A {%0A%20%20%20%20%20 point%3A {%0A%20%20%20%20%20%20%20 radius%3A 0%2C%0A%20%20%20%20%20 }%2C%0A%20%20%20 }%2C%0A%20%20%20 scales%3A {%0A%20%20%20%20%20 xAxes%3A [{%0A%20%20%20%20%20%20%20 gridLines%3A {%0A%20%20%20%20%20%20%20%20%20 color%3A 'transparent'%2C%0A%20%20%20%20%20%20%20 }%2C%0A%20%20%20%20%20 }]%2C%0A%20%20%20%20%20 yAxes%3A [{%0A%20%20%20%20%20%20%20 id%3A 'A'%2C%0A%20%20%20%20%20%20%20 position%3A 'left'%2C%0A%20%20%20%20%20%20%20 gridLines%3A {%0A%20%20%20%20%20%20%20%20%20 color%3A 'transparent'%2C%0A%20%20%20%20%20%20%20%20%20 tickMarkLength%3A 5%2C%0A%20%20%20%20%20%20%20 }%2C%0A%20%20%20%20%20%20%20 ticks%3A {%0A%20%20%20%20%20%20%20%20%09min%3A 0%2C%0A%20%20%20%20%20%20%20%20%20%20%09max%3A 6%2C%0A%20%20%20%20%20%20%20%20%20%20%09maxTicksLimit%3A 1%2C%0A%20%20%20%20%20%20%20%20%20%20%09precision%3A 0%2C%0A%20%20%20%20%20%20%20%20%20%20%09fontSize%3A 8%2C%0A%20%20%20%20%20%20%20 }%2C%0A%20%20%20%20%20 }%2C {%0A%20%20%20%20%20%20%20 id%3A 'B'%2C%0A%20%20%20%20%20%20%20 position%3A 'right'%2C%0A%20%20%20%20%20%20%20 gridLines%3A {%0A%20%20%20%20%20%20%20%20%20 color%3A 'transparent'%2C%0A%20%20%20%20%20%20%20%20%20 tickMarkLength%3A 5%2C%0A%20%20%20%20%20%20%20 }%2C%0A%20%20%20%20%20%20%20 ticks%3A {%0A%20%20%20%20%20%20%20%20%09min%3A 0%2C%0A%20%20%20%20%20%20%20%20%20%20%09max%3A 535%2C%0A%20%20%20%20%20%20%20%20%20%20%09maxTicksLimit%3A 1%2C%0A%20%20%20%20%20%20%20%20%20%20%09fontSize%3A 8%2C%0A%20%20%20%20%20%20%20 }%2C%0A%20%20%20%20%20 }]%0A%20%20%20 }%2C%0A%20%20%20 annotation%3A {%0A%20%20%20%20%20 annotations%3A [{%0A%20%20%20%20%20%20%20 type%3A 'box'%2C%0A%20%20%20%20%20%20%20 yScaleID%3A 'A'%2C%0A%20%20%20%20%20%20%20 yMin%3A 0%2C%0A%20%20%20%20%20%20%20 yMax%3A 3%2C%0A%20%20%20%20%20%20%20 backgroundColor%3A '%23E0E0FF66'%2C%0A%20%20%20%20%20%20%20 borderColor%3A 'transparent'%2C%0A%20%20%20%20%20 }]%0A%20%20%20 }%2C%0A%20 }%0A}>, generated via QuickChart's chart.js renderer: [image: https://quickchart.io/chart?devicePixelRatio=1&w=300&h=50&bkg=white&c={%0A%20%20type%3A%20%27line%27%2C%0A%20%20data%3A%20{%0A%20%20%20%20labels%3A%20[%27%27%2C%27%27%2C%27%27%2C%27%27%2C%27%27]%2C%0A%20%20%20%20datasets%3A%20[{%0A%20%20%20%20%20%20label%3A%20%27comments%27%2C%0A%20%20%20%20%20%20borderColor%3A%20%27blue%27%2C%0A%20%20%20%20%20%20yAxisID%3A%20%27A%27%2C%0A%20%20%20%20%20%20data%3A%20[0%2C1%2C1%2C1%2C2%2C3%2C4%2C4]%2C%0A%20%20%20%20%20%20fill%3A%20false%2C%0A%20%20%20%20%20%20borderWidth%3A%201%2C%0A%20%20%20%20}%2C%20{%0A%20%20%20%20%20%20label%3A%20%27retweets%27%2C%0A%20%20%20%20%20%20borderColor%3A%20%27green%27%2C%0A%20%20%20%20%20%20backgroundColor%3A%20%27%23ff8c00%27%2C%0A%20%20%20%20%20%20pointBorderColor%3A%20%27%23ff8c00%27%2C%0A%20%20%20%20%20%20yAxisID%3A%20%27B%27%2C%0A%20%20%20%20%20%20data%3A%20[80%2C261%2C357%2C475%2C501%2C514%2C527%2C535]%2C%0A%20%20%20%20%20%20pointRadius%3A%20[0%2C0%2C5%2C0%2C0%2C0%2C0%2C0]%2C%0A%20%20%20%20%20%20fill%3A%20false%2C%0A%20%20%20%20%20%20borderWidth%3A%201%2C%0A%20%20%20%20}]%0A%20%20}%2C%0A%20%20options%3A%20{%0A%20%20%20%20legend%3A%20{%0A%20%20%20%20%20%20position%3A%20%27right%27%2C%0A%20%20%20%20%20%20labels%3A%20{%0A%20%20%20%20%20%20%20%20boxWidth%3A%205%2C%0A%20%20%20%20%20%20%20%20fontSize%3A%208%2C%0A%20%20%20%20%20%20%20%20padding%3A%205%2C%0A%20%20%20%20%20%20}%2C%0A%20%20%20%20}%2C%0A%20%20%20%20layout%3A%20{%0A%20%20%20%20%20%20padding%3A%20{%20%0A%20%20%20%20%20%20%20%20bottom%3A%20-20%2C%0A%20%20%20%20%20%20}%0A%20%20%20%20}%2C%0A%20%20%20%20elements%3A%20{%0A%20%20%20%20%20%20point%3A%20{%0A%20%20%20%20%20%20%20%20radius%3A%200%2C%0A%20%20%20%20%20%20}%2C%0A%20%20%20%20}%2C%0A%20%20%20%20scales%3A%20{%0A%20%20%20%20%20%20xAxes%3A%20[{%0A%20%20%20%20%20%20%20%20gridLines%3A%20{%0A%20%20%20%20%20%20%20%20%20%20color%3A%20%27transparent%27%2C%0A%20%20%20%20%20%20%20%20}%2C%0A%20%20%20%20%20%20}]%2C%0A%20%20%20%20%20%20yAxes%3A%20[{%0A%20%20%20%20%20%20%20%20id%3A%20%27A%27%2C%0A%20%20%20%20%20%20%20%20position%3A%20%27left%27%2C%0A%20%20%20%20%20%20%20%20gridLines%3A%20{%0A%20%20%20%20%20%20%20%20%20%20color%3A%20%27transparent%27%2C%0A%20%20%20%20%20%20%20%20%20%20tickMarkLength%3A%205%2C%0A%20%20%20%20%20%20%20%20}%2C%0A%20%20%20%20%20%20%20%20ticks%3A%20{%0A%20%20%20%20%20%20%20%20%09min%3A%200%2C%0A%20%20%20%20%20%20%20%20%20%20%09max%3A%206%2C%0A%20%20%20%20%20%20%20%20%20%20%09maxTicksLimit%3A%201%2C%0A%20%20%20%20%20%20%20%20%20%20%09precision%3A%200%2C%0A%20%20%20%20%20%20%20%20%20%20%09fontSize%3A%208%2C%0A%20%20%20%20%20%20%20%20}%2C%0A%20%20%20%20%20%20}%2C%20{%0A%20%20%20%20%20%20%20%20id%3A%20%27B%27%2C%0A%20%20%20%20%20%20%20%20position%3A%20%27right%27%2C%0A%20%20%20%20%20%20%20%20gridLines%3A%20{%0A%20%20%20%20%20%20%20%20%20%20color%3A%20%27transparent%27%2C%0A%20%20%20%20%20%20%20%20%20%20tickMarkLength%3A%205%2C%0A%20%20%20%20%20%20%20%20}%2C%0A%20%20%20%20%20%20%20%20ticks%3A%20{%0A%20%20%20%20%20%20%20%20%09min%3A%200%2C%0A%20%20%20%20%20%20%20%20%20%20%09max%3A%20535%2C%0A%20%20%20%20%20%20%20%20%20%20%09maxTicksLimit%3A%201%2C%0A%20%20%20%20%20%20%20%20%20%20%09fontSize%3A%208%2C%0A%20%20%20%20%20%20%20%20}%2C%0A%20%20%20%20%20%20}]%0A%20%20%20%20}%2C%0A%20%20%20%20annotation%3A%20{%0A%20%20%20%20%20%20annotations%3A%20[{%0A%20%20%20%20%20%20%20%20type%3A%20%27box%27%2C%0A%20%20%20%20%20%20%20%20yScaleID%3A%20%27A%27%2C%0A%20%20%20%20%20%20%20%20yMin%3A%200%2C%0A%20%20%20%20%20%20%20%20yMax%3A%203%2C%0A%20%20%20%20%20%20%20%20backgroundColor%3A%20%27%23E0E0FF66%27%2C%0A%20%20%20%20%20%20%20%20borderColor%3A%20%27transparent%27%2C%0A%20%20%20%20%20%20}]%0A%20%20%20%20}%2C%0A%20%20}%0A}] The config is on the longer side, but if you don't need an *exact* reproduction you could simplify it quite a bit. Hope this helps - regardless, I will just let you know when I implement some of the Google Image Charts API features you included above. Ian On Friday, February 14, 2020 at 8:05:05 AM UTC-8, David Blume wrote: > > Very nice work. Is supporting charts like this on your roadmap? > https://chart.apis.google.com/chart?cht=lxy&chco=0000FF,00AA00&chs=300x50&chxs=0,0000FF|1,00AA00&chd=t:0,1,2,3,4,5,6,7|0,1,1,1,2,3,4,4|0,1,2,3,4,5,6,7|80,261,357,475,501,514,527,535&chm=r,E0E0FF,0,0,0.543|o,FF8C00,1,2,10&chxt=y,r&chxl=0:|0|6|1:|0|535&chds=0,7,0,6,0,7,0,535&chf=bg,s,F8F8F8&chdl=comments|retweets > > > --David > > On Thursday, February 13, 2020 at 2:22:01 PM UTC-8, Ian Webster wrote: >> >> Hi all, >> >> I've released an open-source drop-in replacement for popular parts of the >> Google Image Charts API. You can just replace "chart.googleapis.com" >> with "quickchart.io", or you can run your own server via the source code >> <https://github.com/typpo/quickchart> or docker. For example, this >> Google Image Chart: >> >> 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 >> >> >> Can be re-written as: 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 >> >> <https://quickchart.io/chart?cht=bvg&chs=300x200&chd=t:5,5,5%7C10,10,10%7C15,15,15&chco=4d89f9,c6d9fd,00B88A&chds=0,20&chbh=a&chxs=0,000000,0,0,_&chxt=y&chm=N,000000,0,,10%7CN,000000,1,,10%7CN,000000,2,,10> >> >> >> As you can see the outputs are quite similar. Documentation, examples, >> and supported options are provided here >> <https://quickchart.io/documentation/migrating-from-google-image-charts>. >> >> It's a work in progress - my goal is to provide a faithful >> reimplementation of the Google Image Charts API but of course the full API >> is quite complicated, so I have focused on the core features. If you need >> help or would like to assist with the open source project please reach out >> or open an issue on Github <https://github.com/typpo/quickchart>. >> Please try it and provide feedback! >> >> (As an aside, if you'd like to migrate to a modern chart framework the >> service also provides a Google Image Charts -> Chart.js conversion. >> Replace the host with quickchart.io and add &format=chartjs-config in >> order to generate the equivalent Chart.js config: https:// >> *quickchart.io*/chart?cht=pc&chd=s:Helo,Wrld&chs=200x100 >> *&format=chartjs-config* >> <https://quickchart.io/chart?cht=pc&chd=s:Helo,Wrld&chs=200x100&format=chartjs-config> >> ) >> >> Ian >> >> On Wednesday, October 9, 2019 at 12:43:19 PM UTC-7, Jon Orwant wrote: >>> >>> The service is running on fumes: as soon as the current serving jobs go >>> down, they are unlikely to come back up. I would migrate off immediately. >>> >>> Jon >>> >>> On Wednesday, October 9, 2019 at 3:40:29 PM UTC-4, Madisyn Margiotta >>> wrote: >>>> >>>> Hi All, >>>> >>>> Any updates on the timeline for this deprecation? We have numerous >>>> emails that utilize these charts as well. >>>> >>>> Thanks! >>>> >>>> On Saturday, February 9, 2019 at 3:44:58 PM UTC-7, Jon Orwant wrote: >>>>> >>>>> Google Image Charts <https://developers.google.com/chart/image/> -- >>>>> not to be confused with Google Charts >>>>> <https://developers.google.com/chart/> -- is the free service at >>>>> chart.googleapis.com that creates static charts. >>>>> >>>>> Its deprecation was announced back in 2012 >>>>> <https://developers.googleblog.com/2012/04/changes-to-deprecation-policies-and-api.html>, >>>>> >>>>> so in theory nobody should be using it now that it's 2019. >>>>> >>>>> Several technical dependencies have made maintaining Google Image >>>>> Charts unsustainable going forward, so it will be *turned off on >>>>> March 14, 2019*. >>>>> >>>>> There is no effective way to identify or contact users of the service >>>>> other than this group, so to alert them we will be creating outages: >>>>> first >>>>> a short one, and then a longer one. >>>>> >>>>> The short outage will be for an hour on *Wednesday, February 13, at >>>>> approximately 1pm Eastern Standard Time*. >>>>> The long outage will be for several hours on *Tuesday, March 5, at >>>>> approximately 10am Eastern Standard Time*. >>>>> >>>>> If you are still using Google Image Charts, we recommend: >>>>> >>>>> >>>>> - >>>>> >>>>> Switching to Google Charts, an actively developed JavaScript >>>>> library for interactive charts and can render many common chart types >>>>> as >>>>> static PNGs. However, Google Image Charts provides some "charts" >>>>> that Google Charts does not, such as QR codes, LaTeX equations, and >>>>> road >>>>> signs. For those we have no suggested replacement. >>>>> - >>>>> >>>>> Using another charting library such as D3 <http://d3js.org> or >>>>> Dygraphs <http://dygraphs.com/> (both JavaScript). >>>>> - >>>>> >>>>> Generating all the charts you'll ever need before March 14 and >>>>> storing them yourself. (Many users of Google Image Charts create the >>>>> same >>>>> exact chart over and over, which is slower and more wasteful than >>>>> generating the chart once and storing it locally.) >>>>> >>>>> >>>>> On a personal note, I've enjoyed maintaining the service over the >>>>> years, and I'm happy to have watched the much more powerful Google Charts >>>>> leapfrog it in capability. >>>>> >>>>> Jon >>>>> >>>> -- You received this message because you are subscribed to the Google Groups "Google Chart API" group. To unsubscribe from this group and stop receiving emails from it, send an email to google-chart-api+unsubscr...@googlegroups.com. To view this discussion on the web visit https://groups.google.com/d/msgid/google-chart-api/dd90458e-dd6d-4329-b292-0c697b068834%40googlegroups.com.
