DougP
DougP

Reputation: 159

Can highcharts export a chart AND table data?

I'm trying to figure out if highcharts can do the following:

Render a standard horizontal bar chart that contains separate table data beneath it (imagine a bar chart with an html-like table beneath it.)

The user would be able to export the entire svg using the exporting.js file that highcharts provides.

This might seem vague, I'm trying to think through this though. I'm not familiar with highcharts at all, but have looked thoroughly at the documentation. It is my understanding that something like this wouldn't be possible using highcharts, as it's text capabilities / options aren't that flexible to represent a data table.

Any possible insight would be great, thanks to everyone!

D.

Upvotes: 2

Views: 4671

Answers (2)

Richard
Richard

Reputation: 439

Stumbled on this years later looking for something related, but I also found this JSFiddle, which might be closer to what has been requested instead of the broken link above.

Highcharts.drawTable = function () {
    // SVG fun
};

window.chart = Highcharts.chart('container', {
    ...chartConfig
});

It literally draws the table in SVG, using the series data. Not saying this is ideal, but it does, however, work for image export, whereas the showTable option doesn't.

Highcharts.chart('container', {
    ...chartConfig,
    exporting: {
        showTable: true
    }
});

The third and probably best compromise is to use the subtitle HTML text to insert your table.

Highcharts.chart('container', {
    ...chartConfig,
    subtitle: {
        title: '<div>Anything goes</div>',
        useHTML: true
    }
});

Dynamically setting this for the chart at export (allowing you to keep whatever subtitle you want to display on the webpage) involves calling the setTitle method:

chart.setTitle({text: "New Title"});

Upvotes: 0

wergeld
wergeld

Reputation: 14462

If you check the HighCharts forum you can see a hack to get that. It is not very clean but it does wonders. If your datatable if very large you may want to think about only showing portions of the data at a time (using zoom in chart).

Upvotes: 4

Related Questions