a---- / highcharts-export-clientside Goto Github PK

Hi,
Was so excited to find your plug in for highcharts. But when I download xls from your demo site and try to open in excel 2010 I get:

"The file you are tyring to open, 'monthly-average-temperature.xls', is in a different format than specified by the file extension..."

So the excel format seems to be incorrect.

Would be great if the chart and data could export to excel. Hope this can be fixed.

Thanks

Exported file cannot be opened with excel anymore (worked in the past).
A good example is the demo from your homepage
http://a----.github.io/highcharts-export-clientside/
Pressing "XLS" and "open with Excel" results in Excel popping up, showing no worksheet at all.

Tested with

• highcharts-export-clientside v1.1.4 – 2015-11-20
• highcharts JS v4.2.3 (2016-02-08)
• Microsoft Office Home and Buiness 2010
• Excel V 14.0.7166.5000 (32-Bit)
• Firefox 47.0.1
• Win 10 Pro 64Bit, V.1511

Hi A----,

I am using your JS plugin to export Highcharts to PNG/SVG/PDF/JPG formats.

1.PNG is working fine but image is not opening as the server is not having Desktop experience installed in it. Can you please help me to find out the issue in it.
2. PDF is generating but it is displaying background color as black. Please help me to clear the background color.

MyChart.pdf

1. JPG is not displaying in the list of exports in IE 11 browser. It is displaying in Chrome browser. Is there any compatability with the browser.

FYR below is the screenshot

The JSFiddle which I followed to do this is http://jsfiddle.net/pscjzhe4/1/

Please take a look into my issue and let me know what I can provide you to solve the issue.

@GeoffreyOfficial found out that when you scale attribute doesn't work anymore when used with sourceWidth / sourceHeight. See issue #14 .

This module does not work correctly with highcharts starting from 4.2.0.

This example

http://jsfiddle.net/3q935m7m/3/

works fine with highcharts 4.1.9 (also tested with 4.1.10):

However, if you switch to 4.2.0 (also tested with 4.2.3), the svg-export does not work (other chart types seem to work, though):

On my local machine it works fine, however once our JS is compiled I get the following errors when clicking on "download PDF"

bower update is telling me there is an update for jsPDF to version 1.1.135, but highcharts-export-clientside requires a previous version 1.0.272. Is there any problem with upgrading the dependency version in bower.json?

Hi,

We are using this module in our applications. This has an internal dependency on 'highcharts' https://github.com/highcharts/highcharts-dist/ module. Today (09/21/2016) a new version v4.2.7 of highcharts is released. With the new version it is breaking the code internally. Below is the exact error.

jQuery.Deferred exception: Cannot read property 'drilldown' of null TypeError: Cannot read property 'drilldown' of null
    at http://localhost:6015/bower_components/highcharts/modules/drilldown.js:15:110
    at Array.forEach (native)
    at q (http://localhost:6015/bower_components/highcharts/highcharts.js:26:277)
    at Object.d.Axis.getDDPoints (http://localhost:6015/bower_components/highcharts/modules/drilldown.js:15:4)
    at Object.x.drillable (http://localhost:6015/bower_components/highcharts/modules/drilldown.js:15:273)
    at Object.<anonymous> (http://localhost:6015/bower_components/highcharts/modules/drilldown.js:16:139)
    at Object.a.(anonymous function) (http://localhost:6015/bower_components/highcharts/highcharts.js:22:244)
    at Object.<anonymous> (http://localhost:6015/js/Highcharts/plugins/customEvents.js:213:34)
    at Object.a.(anonymous function) [as addLabel] (http://localhost:6015/bower_components/highcharts/highcharts.js:22:244)
    at Object.Ya (http://localhost:6015/bower_components/highcharts/highcharts.js:15:102) undefined

As a workaround, we are explicitly installing the previous version of highcharts v.4.2.6.

old bower.json file was looking like...

"dependencies": {
    "bootstrap": "^3.3.6",
    "highcharts-export-clientside": "^1.1.4"
  }

To fix the issue, we mentioned the exact highcharts version

"dependencies": {
    "bootstrap": "^3.3.6",
    "highcharts": "4.2.6",
    "highcharts-export-clientside": "^1.1.4"
  }

Just wanted to bring this to your attention.

Thanks in advance.

This error is showing in my console. Even if you look at example here. Since I dont want to change any source functions is there a way a can get rid of this error? thank you

I'm using this for exporting.filename and it works great for JPG, PNG and PDF however for CSV and XLS the filename is function (options, chartOptions) {- var title = this.title - this.title.textStr.replace(- -g, '-').toLowerCase() - 'chart';- return title;- }.csv

https://github.com/highslide-software/export-csv/blob/master/export-csv.js#L185
https://github.com/highslide-software/export-csv/blob/master/export-csv.js#L194

The exported file should do what the export-csv plugin does and use the chart title as the downloaded filename, defaulting back to the existing 'chart' string if no title exists.

In my case I don't need to download the exported image but rather send it to server (in order to include it into PDF). Just the base64 representation would be fine. Is that possible with this lib?

Series with a dash style are exported without the style (it works when we use the export server)
http://jsfiddle.net/pscjzhe4/197/

I have a problem if I use "
" on plotOptions.dataLabels.format. Exporting charts have problem with labels. It's look like this:

That bower statement seems incomplete :)

Dependencies are not shipped, so you'll have to do the following:

bower install

Example:

http://jsfiddle.net/pscjzhe4/212/

I'm getting same js error as described here:
http://stackoverflow.com/questions/16149147/highcharts-canvas-tools-cannot-read-property-prototype-of-undefined/24334591#24334591

The scripts are included in the following order:

#= require highstock-release/highstock
#= require highstock-release/modules/exporting
#= require highstock-release/modules/canvas-tools
#= require export-csv/export-csv
#= require jspdf/dist/jspdf.min
#= require highcharts-export-clientside/highcharts-export-clientside

As it's noted here canvas-tools.js isn't supposed to be included in a script file. But if I don't include it manually(expecting it will be lazy loaded by the highcharts) then exporting PNG or JPEG becomes unsupported.

Is there any solution to fix this?

Thanks!

It won't open files such as PDF although I have Adobe Reader in my phone. However, normal Highcharts exporting works with mobile browsers and it always asks whether I want to open the file in a mobile browser. So are mobile browsers supported in client-side exporting?

Hi A----,

Thank you for the your awesome plug-ins keep it up.

I just want to bring something to your attention a plug-in was created to make your highcharts faster if you have to many records which is called Boost.js.

Now your exports works fine with the boost till certain amount of records (5000), then it breaks your plug-in.

Can you please give me a solution or do you think the problem is with the boost.js plug-in.

When loading the required dependencies for exporting to JPG/PNG (i.e. canvas-tools) a javascript error appears:

Uncaught TypeError: Cannot read property 'prototype' of undefined

This is because CanVGRenderer is undefined at this line:

A quick search revealed these posts / issues:

• http://stackoverflow.com/questions/16149147/highcharts-canvas-tools-cannot-read-property-prototype-of-undefined
• highcharts/highcharts#2311

And the 'official response' is that the file shouldn't be included, but is loaded lazily on devices that don't support SVG (see http://api.highcharts.com/highcharts#global.canvasToolsURL).

The jspdf seems to be giving this error. If i remoev jsfdp lib then all is fine.

I was trying to export a chart as PNG or SVG in Microsoft EDGE and it does not work

DOM7011: The code on this page disabled back and forward caching. For more information, see: http://go.microsoft.com/fwlink/?LinkID=291337

SCRIPT1223: The operation was canceled by the user.
highcharts-export-clientside.js (396,7)

from what I can find EDGE does not support it (http://stackoverflow.com/questions/33197625/detect-data-uri-in-links-support-with-modernizr)

i did a quick hack and set browserSupportDownload = false;

This did bypass the error, but when it exported the PNG it was entirely black.

Expected behaviour

When I export a chart in XLS format, the file should be opened without any error

Actual behaviour

When I open the XLS file, I get an error saying that the file has a different format than the extension specified by the file. This error DOESN'T happen when I export the file in CSV format.

Live demo with steps to reproduce

https://jsfiddle.net/pscjzhe4

Affected browser

Chrome

Affected Office version

Excel 2007

Hello,

I tried to export a chart with an image in it ( I use the fonction "renderer"). But this doesn't word. Like you can see here:
http://jsfiddle.net/sonf6Ln9/
Please can you help me ?

I have a chart where I use dashStyle: 'Dot' which works fine on the chart in the browser but when exported it does not use the dsahStyle and renders a solid line instead

First of all, thank you for contributing to the Highcharts eco system!

According to your readme:

You may need to export a chart you made using HighCharts to an image or a PDF. It has an exporting module but it relies on an export server, which by default is http://export.highcharts.com/ and you also –unlucky you– have one or more of the following [...]

This is no longer true, since we launched our own offline export module in June. It would be greatly appreciated if you update the information in your readme.

The client side export plugin is a massive benefit for all HighCharts users, however, there is an issue when an image is applied to the chart.

I add an image to a chart like so ....

chart: {
renderTo: 'container',
type: 'spline',
....
borderWidth: 3,
events: {
load: function () {
this.renderer.image('http://highcharts.com/demo/gfx/sun.png', 175, 75, 30, 30).add();
}
}

However, only the SVG option will render a chart successfully. PNG, JPG and PDF will go through the motions of an export but will in fact render 'empty' images.

Fiddles of this issue can be seen here ...
http://jsfiddle.net/JohnnyRS/xa8wke0b/3/
http://jsfiddle.net/pscjzhe4/32/

Also, in case there is any bearing on the matter, I asked this question on SO as initially I thought this export issue was related to a Type C Error I was getting in my FireFox console, but it doesn't seem to be the case.

SO, question ...
http://stackoverflow.com/questions/29625141/highcharts-clientside-export-plugin-typeerror-c-is-undefined

Finally, in case anyone adds anything to my HighCharts forum post that has any extra information for you.
http://forum.highcharts.com/topic32830/

Thank you.

Fiddle: http://jsfiddle.net/0w6audhr/1/

The exported PDF has in the fiddle has a lot of whitespace on the right side of the chart. This seems to relate to the hight of the chart container in some way. A Container height above 1500px fails to produce a PDF completely.

Image based exports work fine.

It seems like this module is only able to use global Highcharts object. It would be nice if it could be installed with NPM and require()d like Highcharts itself.

Would submit PR.

Highcharts has support for exporting multiple charts via a hack, can this be supported also with client-side exporting?

http://www.highcharts.com/docs/getting-started/frequently-asked-questions#export-multiple
http://jsfiddle.net/highcharts/gd7bB/

I just quickly ran eslint over the source and it exposed several places of undeclared variables, which means the variables get assigned to the global scope. There is also inconsistent indentation, use of quotes, semicolons, but I think these are important to fix:

    7:7   error    "oldExport" is defined but never used                    no-unused-vars
   74:58  error    "chartOptions" is defined but never used                 no-unused-vars
   97:14  error    Empty block statement                                    no-empty
  132:7   error    "menuItem" is defined but never used                     no-unused-vars
  197:35  error    "dotdotdot" is defined but never used                    no-unused-vars
  228:62  error    "chartOptions" is defined but never used                 no-unused-vars
  302:11  error    "optionToCopy" is not defined                            no-undef
  303:34  error    "optionToCopy" is not defined                            no-undef
  304:52  error    "optionToCopy" is not defined                            no-undef
  304:87  error    "optionToCopy" is not defined                            no-undef
  375:81  error    Unnecessary semicolon                                    no-extra-semi
  400:7   error    "blobObject" is not defined                              no-undef
  401:41  error    "blobObject" is not defined                              no-undef

Hello,

How can I export highchart to excel with data and chart image in same file ?

Would it somehow be possible here to export multiple charts as well?

Our project will no longer have bower (and every other ember-cli 2.13 and above app). It would be great to have this pushed to the npm registry and a package.json included. This relates to #27 , but adding a package.json seems different from the discussion in that issue.

Is there a way to globally override all charts to just allow certain mime types?

I found the following bugs when testing the client-side export module plugin with CSV and XLS exporting, can you please fix them?

BUG 1

With a particular amount of categories and series data scandinavian characters (ä, ö) and euro sign (€) are not displayed correctly in the XLS file

http://jsfiddle.net/pscjzhe4/208/

However, strangely it starts working if you add more categories and series data:

http://jsfiddle.net/pscjzhe4/209/

BUG 2

Scandinavian characters (ä, ö) and euro sign are not displayed correctly at all in the CSV file (no matter if you have more or less categories and series data in the CSV file

http://jsfiddle.net/pscjzhe4/210/

BUG 3

If you open the exported XLS file in Excel 2013 you'll get an error message saying that "The file format and extension of [filename].xls don't match. The file could be corrupted or unsafe. Unless you trust its source, don't open it. Do you want to open it anyway?" If you click Yes, it will open the file in Excel. However, it always shows this error message when trying to open the exported XLS file, so it's just annoying and confusing for users to see it every time.

I test in ie8,the right top exporting button show "print chart",no save image buttons.And try to run in chrome,is ok!

If you dynamically update the label you created with chart.renderer.label, it won't get exported to images and PDF

Example:

Click on the "change label" button to dynamically update the label and then do the exporting.

http://jsfiddle.net/pscjzhe4/215/