Question

So here are my requirements:

1. Render chart data
2. User can specify all chart labels (x, and y axis, header, sub-header, footer, sub-footer)
3. User can export the chart to various formats
4. Potentially support other arbitrary content like side-bars

Highcharts was a great choice for #1 and #3. It even had most of #2 covered, however, it does not natively support the concept of footers.

Initially I was just outputting the footers as plain HTML elements below the rendered highchart object, but when exporting the highchart the footers were, obviously, not included.

I then learned that highcharts allows free-from drawing by tapping into its own internal renderer, which seemed perfect to address both #2 and #4!

http://www.highcharts.com/ref/#renderer

However, the text and shapes I’m rendering are still not exported. I was able to easily create an example that illustrates what I’m trying to do via jsfiddle.

http://jsfiddle.net/B6s7V/1/

Can anyone help me satisfy those requirements? Perhaps there is some flag I’m missing in highcharts to let everything export?

Answer 1

I figured it out. Instead of doing the free-form rendering in the on complete callback of the Highcharts.Chart function, I’m doing it in the load event.

So strange that moving where I did the rendering fixed it.