kirjs / react-highcharts

React wrapper for Highcharts library
http://kirjs.github.io/react-highcharts/
MIT License
1.26k stars 233 forks source link

Download does not work with HighStock #400

Closed giangiot closed 5 years ago

giangiot commented 6 years ago

Hi all, I imported the exporting and export-data modules for export my data in csv in this way.

import ReactHighcharts from "react-highcharts";
require('highcharts/modules/exporting')(ReactHighcharts.Highcharts);
require('highcharts/modules/export-data.src')(ReactHighcharts.Highcharts);

and the export works like a charm. But if I try to export the data from HighStock, changing only the first line this way: import ReactHighcharts from "react-highcharts/ReactHighstock"; I receive this error:

Uncaught TypeError: Cannot read property 'dateFormat' of undefined at export-data.js:547 at Array.forEach () at a.each (highstock.js:29) at a.Chart.Highcharts.Chart.getDataRows (export-data.js:540) at a.Chart.Highcharts.Chart.getCSV (export-data.js:584) at a.Chart.Highcharts.Chart.downloadCSV (export-data.js:854) at a.Chart.onclick (EnvironmentChart.js:71) at HTMLDivElement.onclick (exporting.js:21)

The chart renders in both ways (with some graphical differences, of course). I cannot find any problem in the highcharts documentation, could this be a problem on how ReactHighcharts.Highcharts is returned? This is my config:

exporting: {
    csv: {
        decimalPoint: "."
    },
    buttons: {
        contextButton: {
        menuItems: [
            {
            textKey: 'downloadCSV',
                     onclick: function () {
                         this.downloadCSV();
                     }
                 }]
    }
    }
}
CameronCarranza commented 6 years ago

I ran into some issues here as well, though mine wouldn't render at all with Highstock when trying to add highcharts-more. Here's what I ended up with that worked for Highstock.

Imports

import Highstock from 'highcharts/highstock';

require('highcharts-more')(Highstock);
require('highcharts/modules/exporting')(Highstock);
require('highcharts/modules/export-data.src')(Highstock);
const ReactHighcharts = require('react-highcharts/ReactHighstock').withHighcharts(Highstock);

Render <ReactHighcharts config={options}/>

kirjs commented 5 years ago

Closing and there has been no activity in this issue for a while. if this is still relevant, please feel free to reopen