I'm having trouble forcing highcharts to export offline. I've added the offline-exporting.js module along with the exporting module. I've set the fallbackToExportServer to false, but I still go to the highcharts server (https://export.highcharts.com/) and get this error: 13 Request Entity Too Large.
<script src="//code.highcharts.com/highcharts.js"></script>
<script src="//code.highcharts.com/modules/data.js"></script>
<script src="//code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/offline-exporting.js"></script>
exporting: {
filename: title,
fallbackToExportServer: false,
To see the issue, go to: https://www.nrel.gov/transportation/drive-cycle-tool/
In the Drive cycles table, search for “Fleet DNA”.
Click on “Fleet DNA Drayage Maximum Energy*”
Scroll up and click “Download Drive Cycle Data or Image” under the chart.
Choose “Download JPEG image”
Some data sets work fine.
It is linked to this reported issue:
https://github.com/highcharts/highcharts/issues/4614
As a workaround you could set up a custom exporting server with increased size limit:
https://www.highcharts.com/docs/export-module/setting-up-the-server
I noticed the same issue few days back, kind of strange, despite setting the flag to false, it was calling the highchart server for chart pdf.
I then resorted to use exportChartLocal method of highchart chart instance:
chart.exportChartLocal({
type: 'image/jpeg', // replace with image/jpeg
filename: 'test.jpg',
fallbackToExportServer: false,
sourceWidth: 900,
scale: 1,
});
Look at this example: https://jsfiddle.net/riteshwaghela/huw8e31z/7/
Related
I am just starting to use jsPDF and I think it may actually work (after attempting a zillion different ways to produce PDFs in my Quasar/Electron desktop application that have not worked).
Is there a way to display the PDF in the application window?
this.doc = new jsPDF({
orientation: "landscape",
unit: "in",
format: [4, 2]
})
this.doc.text(this.dogArray[0].dogCallName, 1, 1)
this.doc.save("test.pdf")
That works and I can save the PDF, but I'd also like to be able to display the generated PDF in the Electron browser window. I can console.log out this.doc, and I can display it on the window, but it's just a bunch of string info.
Is there something like doc.view("file.pdf") that can be used? I'm looking through the jsPDF documentation but I'm not seeing what I'm looking for.
I want to be able to see the PDF like the author shows on his Demo Website
error thrown by highchart-more library while clicking on print chart (exporting button).
i'm trying to export (print chart) a columnrange graph.
Even i found that the demo example on highchart is also throwing the same error.
https://www.highcharts.com/demo/columnrange?cf_chl_jschl_tk=75ef57b90426bb8711968566eb4df741cf64c9a6-1591202845-0-AZwTKQgqzxGQZDW-Rq4JOgEgcwcOmwgfRMadAmbWU1-gwfLNp3h-bTchWfh2zFIRQTkOHFAlxZTshcL9Zn5dvQqDHGY7VRsSpCOoL-tzk-fkIW2gwOt7DrGyZSWjuljLg-CvjjO2Z87if54GYlLmpeVuDHpL-5Vfl0mleCW0U8WdHUjmRyswY_332RrXJxtjoJhCBqY0AYpW9NnDXfK7Kl6dRkat5Roeeso4bEjY2hkWnylV7Eo0K7BxzEBPDAXQZZLionI8SGtXNon3v12b3MBE_TwsReW9JfaECbtlnzDmWnq4PA1G8u_hWU7B8pYEx9LQ9r40INKMVf1Jdkcsf_H6CMmZ6C211e9cvI06KHhP
This is a Highcharts bug that is reported here: https://github.com/highcharts/highcharts/issues/13575
The issue is resolved and the fix will applied in the next version. As a workaround you can use the code from master or some previous version:
<script src="https://code.highcharts.com/8.0.4/highcharts.js"></script>
<script src="https://code.highcharts.com/8.0.4/highcharts-more.js"></script>
<script src="https://code.highcharts.com/8.0.4/modules/exporting.js"></script>
Live demo: http://jsfiddle.net/BlackLabel/6m4e8x0y/5019/
Highcharts file service: https://code.highcharts.com/
I have a page and there are four line charts on it. By having
exporting: {
enabled: false
}
I am able to see a Highcharts-generated export dropdown with options such as Download as PDF on each chart. These export options do not involve any access to the server. This is a pure client-side solution.
I wonder whether there is any way to use Javascript in the browser that allows me to export all charts on the page in a single PDF document?
Thanks and regards.
Well, I hate to be the one to break this to you but one clarification needs to be made, the default export options aren't really pure client-side. They leverage highcharts' own exporting server, one can override the exporting server's url using the exporting.url configuration option
url: String
The URL for the server module converting the SVG string to an image format.
By default this points to Highslide Software's free web service. Defaults to http://export.highcharts.com.
You may want to read their disclaimer & privacy statement & read more about the export module here
You can consider setting up your own exporting server, and override the export function to send SVG of all the charts on your page and do the stitching on the server side and send back the image.
exporting: {
buttons: {
contextButton: {
menuItems: [{
text: 'Export All Charts',
onclick: function() {
var allCharts=Highcharts.charts;
var svgArray=[];
for(var i=0;i<Highcharts.charts.length;i++){
svgArray[]=Highcharts.charts[i].getSVG();
}
// ... Post svgArray to your exporting server
}
}]
}
}
}
Having said that, modern browsers do support saving content of HTML5 canvas elements, check this jsFiddle that uses canvg library to export a single chart. P.S. This isn't the default behavior of highcharts
I am using HighCharts version 3.0.2. Have set up the Highcharts server locally for exporting the charts. When download as png/jpeg/pdf is selected from the top right corner of the chart , the Highcharts demo page is displayed.
Please let me know what could be the reason for this.
Note: Have set the Phatom js path in my app.properties file of highcharts export server.
Probably you're exporting.urlends without a trailing slash. The export-server will redirect the GET (without trailing slash) to the demo/welcome page
Instead of
exporting: {
url: http://localhost/export
}
do this
exporting: {
url: http://localhost/export/
}
I'm using highcharts-convert.js with phantomjs, and I'm having some text-overlapping issues when exporting the charts.
I believe the reason is Chrome on OSX renders fonts differently than my ubuntu server does. So when the client's browser builds the SVG the text does not overlap (I have indeed confirmed this by capturing the POST and rendering the svg in Chrome), but when phantomjs renders the text on ubuntu its slightly wider so there is overlap.
I believe that if I export the options JSON rather than SVG, ubuntu will lay out the text according to its own font rendering, and nothing will overlap.
Does that make sense? If so, how can I get highcharts to POST the options JSON rather than SVG?
I have this process that I can use to rig everything up, but it feels like there should be a better way...
var chart = graphContainer.find(".graph-body div").highcharts();
var chartOptions = chart.options;
delete chartOptions.chart["renderTo"]; // this creates a circular reference
// provide extra options to override the chart's defaults here...
$.extend(chartOptions.chart, {backgroundColor: "#FFFFFF", spacingLeft: 30, spacingRight: 30});
// wrap this up and POST it to the server...
console.log(JSON.stringify(chartOptions));