CODEWITHSUNDEEP
highchartsphantomjs
Joe Riggs
Joe Riggs

Reputation: 1324

HighCharts Export Server not creating image

I have installed phantomjs (using npm -g option) and copied the relevent highchart files down from the github directory. Here's what the directory listing looks like - i chmod/chown'd everything to be wide open in case that was the problem

drwxrwxrwx 2 www-data www-data   4096 2013-08-30 15:01 ./
drwxr-xr-x 9 root     root       4096 2013-08-29 18:11 ../
-rwxrwxrwx 1 www-data www-data    183 2013-08-30 13:43 callback.js*
-rwxrwxrwx 1 www-data www-data   4436 2013-08-30 13:34 data.js*
-rwxrwxrwx 1 www-data www-data  15464 2013-08-30 13:34 highcharts-convert.js*
-rwxrwxrwx 1 www-data www-data 139290 2013-08-30 13:34 highcharts.js*
-rwxrwxrwx 1 www-data www-data  21781 2013-08-30 13:34 highcharts-more.js*
-rwxrwxrwx 1 www-data www-data 173186 2013-08-30 13:34 highstock.js*
-rwxrwxrwx 1 www-data www-data  92629 2013-08-30 13:34 jquery.1.9.1.min.js*
-rwxrwxrwx 1 www-data www-data    223 2013-08-30 13:55 options1.json*
-rwxrwxrwx 1 www-data www-data   3249 2013-08-30 13:34 readme.md*

Command line works as expected:

phantomjs highcharts-convert.js -infile options1.json -outfile chart1.png -scale 2.5 -width 300 -constr Chart -callback

Creates chart1.png - and it looks like I would expect. I am able to start the webserver using this command

phantomjs highcharts-convert.js -host 0.0.0.0 -port 8080

OK, PhantomJS is ready.

I have created a short js to send post data

var p ={"infile":"{xAxis: {categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']},series: [{data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]}]};","outfile":"test1.png","constr":"Chart"}
console.log('success');
    data=JSON.stringify(p);
$.ajax({
type: 'POST',
data: data,
url: 'http://myip:8080',    
success: function(data) {
    console.log('success');

    }
});

This returns a 200 code but no data is returned to the browser. I have uncommented the line 107 in highcharts-convert.js = console.log(msg);

So I get this output 

Highcharts.options.parsed
Highcharts.customCode.parsed
Highcharts.images.loaded

but no image that i can find. Thoughts?

Edit

Curl is working

curl -H "Content-Type: application/json" -X POST -d '{"infile":"{xAxis: {},series: [{data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]}]};","constr":"Chart","outfile":"/var/www/node/image/chart.png"}' 127.0.0.1:8080

except that I get a base64 string instead of the script saving the image. I got parts o the curl from here: http://www.highcharts.com/component/content/article/2-news/56-improved-image-export-with-phantomjs

Upvotes: 2

Views: 3295

Answers (3)

gert vaartjes
gert vaartjes

Reputation: 988

The highcharts-convert.js script has undergone some changes. When specifying the outfile parameter while running the script in servermode, will create a file on the server. The script returns the file location on the server. This can be send to the client, so an download can be triggered from the client.

The above is facilitated by the Java highcharts export-server with the async parameter.

read more here

I thought this might be an alternative solution

Upvotes: 1

Joe Riggs
Joe Riggs

Reputation: 1324

I went with the php/batik solution instead, I would still like to get this solution working in the future.

Note, the downloads to batik listed in the tutorial http://xmlgraphics.apache.org/batik/#download http://xmlgraphics.apache.org/batik/download.cgi Leads to a 403 page, maybe consider linking somewhere else? I used a google cache for the page.

Upvotes: 0

gert vaartjes
gert vaartjes

Reputation: 988

PhantomJS can make a image and save it locally, but it doesn't support file download. That's why it's returning a 64 string representation of an image instead.

Upvotes: 1

Related Questions