Search code examples
javascriptcordovahighchartsphonegap-pluginscanvg

How to export rendered Highchart chart as a pdf/png/jpeg in a Phonegap application?


I am trying to use

chart.exportChart({
  type: 'application/pdf',
  filename: 'my-pdf'
});

in a Phonegap application with no success, although all is working fine in the browser.

My Problem:

I want to attach the rendered chart as a pdf/png/jpeg in the iOS email client. How is it possible to save the downloaded content using chart.exportChart or any other way to the iOS Application Sandbox? Should I give the App Sandbox path in the filename key of the chart.exportChart method?

Here is wat i tried:(I am on cordova-1.6.1.js)

window.requestFileSystem  = window.requestFileSystem || window.webkitRequestFileSystem;
    window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFileSys, fail);


function fail() {

}

function gotFileSys(fileSystem) {
    chart.exportChart({
       type: 'application/pdf',
    filename: fileSystem.root.fullPath+"/my-pdf"
    });
}

The above dosen't work and console says-

[INFO] Error in success callback: File1 = TypeError: 'undefined' is not a function

PS: The way I tried is an act of Desperation :(


Solution

  • Could do it like this-

    canvg(document.getElementById('canvas'), chart.getSVG());
    var canvas = document.getElementById("canvas") ; 
    var img = canvas.toDataURL("image/png").replace("data:image/png;base64,", ""); //img is base64 encoded and can be persisted in the App Sandbox.
    

    Will need to write a PhoneGap plugin and use Matt's Category to convert base64 encoded img into an image and save the binary in the App Sandbox.

    canvg scripts are available at here and here shall be included in the markup as well.