Gilgamesh
Posts: 1
Joined: Wed Sep 19, 2018 9:01 pm

Export CVS only visible/selected range

Hey guys,

I'm relatively new to Highcharts/Highstock and coding in general, so excuse my ignorance.
When I export my rendered chart via the export menu into cvs the whole series gets exported.
Is there a way to export only the (in the navigator) highlighted and visible part of the series?
Googling the issue I got a lot of contradictory answers that didn't really explain how to accomplish that (if it was even possible according to them).

If so, how do you do it and which modules do I have to implement.

I hope you can help me out. Thanks :)
rafalS
Posts: 2665
Joined: Thu Jun 14, 2018 11:40 am

Re: Export CVS only visible/selected range

Hi, Gilgamesh!

Exporting is being handled by export-data.js module and getDataRows function inside it. By default, export csv method loops each series and each data point. We just need to add if condition that will check, if our point is visible (on the x-axis for example):

Code: Select all

if (point.x >= series.xAxis.min && point.x <= series.xAxis.max) {
  ...
   }
You can see an example here: http://jsfiddle.net/BlackLabel/j01e9xtb/

Best regards!
Rafał
Rafal Sebestjanski,
Highcharts Team Lead
dcryptt
Posts: 6
Joined: Thu Dec 12, 2019 7:19 pm

Re: Export CVS only visible/selected range

Hi Rafal,

thanks for providing the code for this functionality. I was wondering, is there a way to set this behavior for the CSV and XLS exporting options, instead of adding a special button for it like in your example? So by clicking either of these, the default will be to export only the data currently being shown in the graph.

Thanks!
rafalS
Posts: 2665
Joined: Thu Jun 14, 2018 11:40 am

Re: Export CVS only visible/selected range

Hi,

Welcome to our forum.

Yes, my solution is already supporting it. You just need to add exporting.js module.
Here you can test it - change extremes to have only a few visible points, export CSV file and you will see that only visible points were exported: https://jsfiddle.net/BlackLabel/wgtoke6n

Best regards!
Rafal Sebestjanski,
Highcharts Team Lead
connor.dennehy
Posts: 2
Joined: Fri Jul 03, 2020 5:52 pm

Re: Export CVS only visible/selected range

Hi Rafal,

I'm very new to this so please forgive my ignorance, but is there a way to modify the standard export-data.js script directly to achieve this modification?
piotr.m
Posts: 1433
Joined: Mon Nov 18, 2019 8:15 am

Re: Export CVS only visible/selected range

Hi connor.dennehy,

Do you mean combining the functionality of these two export-data and exporting modules into one file?

Kind Regards
connor.dennehy
Posts: 2
Joined: Fri Jul 03, 2020 5:52 pm

Re: Export CVS only visible/selected range

Appreciate the response. No, I mean modifying export-data.js specifically so that it only generates csv/xls tables for the selected range. In the example you provided, the javascript does not seem to resemble that of the standard export-data code, so I don't understand how I would incorporate it.
piotr.m
Posts: 1433
Joined: Mon Nov 18, 2019 8:15 am

Re: Export CVS only visible/selected range

Hi,

Here you can learn more about how it works and how it was modified:
https://www.highcharts.com/docs/extendi ... highcharts

As for your question, if you want to load files from CDN as in the examples above,
there is no other way to edit this code unless you want to load highcharts files from a local folder:
https://www.highcharts.com/docs/getting ... stallation

Let me know if you meant it!

Best Regards
fabio
Posts: 3
Joined: Wed Jul 21, 2021 2:13 pm

Re: Export CVS only visible/selected range

Hello
I have the same issue. When try specify the period of time to get the values in csv/xml I got a number (Unix timestamp). The solution here is not work. It's return Unix Timestemp. Could you please give support.
fabio
Posts: 3
Joined: Wed Jul 21, 2021 2:13 pm

Re: Export CVS only visible/selected range

I did the same but wth the new version. Thanks
Update the example(version 9.1.2)

Fiddle example
http://jsfiddle.net/stembrino/pw7bjdhu/10/#save
piotr.m
Posts: 1433
Joined: Mon Nov 18, 2019 8:15 am

Re: Export CVS only visible/selected range

Hi,

I’m glad you found a solution!
Feel free to contact us if further needed.

Best Regards
fabio
Posts: 3
Joined: Wed Jul 21, 2021 2:13 pm

Re: Export CVS only visible/selected range

Hello.
There is a problem when we have more than one column. In this case, the csv getDataRows from data-export will add one column with date time to each column y axis. Example, if I have date time in x axis and values in y. So, the graph has three lines represent the differents events from something. In csv will show something like this (I'm using the ";" separator):

"DateTime";"Column1";"DateTime";"Column2";"DateTime";"Column3";"Standard deviation"
"2021-07-20 14:45:00";0;"2021-07-20 14:45:00";0;"2021-07-20 14:45:00";0;0
"2021-07-20 16:30:00";12;"2021-07-20 16:30:00";0.703125;"2021-07-20 16:30:00";-1.0350465774536133;2.4412965774536133
"2021-07-20 16:45:00";6;"2021-07-20 16:45:00";2.44921875;"2021-07-20 16:45:00";-0.9484710693359375;5.8469085693359375
"2021-07-20 17:00:00";0;"2021-07-20 17:00:00";1.4501953125;"2021-07-20 17:00:00";-1.7780158519744873;4.678406476974487
"2021-07-20 17:15:00";0;"2021-07-20 17:15:00";1.6611328125;"2021-07-20 17:15:00";-4.00670862197876;7.32897424697876
"2021-07-20 17:30:00";0;"2021-07-20 17:30:00";0.3955078125;"2021-07-20 17:30:00";-0.9539783000946045;1.7449939250946045
"2021-07-20 17:45:00";0;"2021-07-20 17:45:00";0.3955078125;"2021-07-20 17:45:00";-0.9539783000946045;1.7449939250946045

As you can see. there are date time three time, but the expectation is once. Could you help me, please.
piotr.m
Posts: 1433
Joined: Mon Nov 18, 2019 8:15 am

Re: Export CVS only visible/selected range

Hi,

I don't know if I understand the problem correctly but you probably need to parse this data properly on your side first using custom configuration or available API. Here you can see an example of what I mean and how it can be done: https://www.highcharts.com/blog/tutoria ... -data-api/

Kind Regards

Return to “Highcharts Stock”