Question

我们正在使用 Phonegap + Ionic 开发移动应用程序。我们在我们的应用程序中使用 Highcarts 。我们希望提供一个功能，以分享Facebook，Whatsapp或Twitter的高清图。分享不是phonegap的问题，因为有一个可用的插件。

问题是，当我们想要使用phonegap插件共享任何图像时，我们需要提供Image和Highchart的路径，使用SVG来显示图表。

我尝试使用phonegap的 org.devgeeks.Canvas2ImagePlugin 将 SVG转换为Canvas 然后导出该画布，但没有任何效果。

有人可以帮助或分享一些代码，如果他们已经达到了这样的目的。

提前致谢。

Answer 1

花了好几个小时后我们就有了解决方案。希望这也能帮助别人。

（1）安装Cordova插件＆＃34; org.devgeeks.Canvas2ImagePlugin＆＃34;。

（2）获取高清图的SVG html。

var svg = document.getElementById('chart1').children[0].innerHTML;

（3）创建一个Canvas html元素，并将该canvas元素追加到页面div中。

 var canvas = document.createElement('canvas');
 canvas.width = $window.innerWidth;
 canvas.height = 500;

 document.getElementById('divID').innerHTML = '';
 document.getElementById('divID').appendChild(canvas);

（4）Canvg会将图像添加到画布中。

canvg(canvas, svg, { log: true, ignoreMouse: true, ignoreAnimation: true });

（5）在Cordova插件的帮助下，您可以下载这样的图像

window.canvas2ImagePlugin.saveImageDataToLibrary(
    function(path) {
        console.log(path);
    },
    function(err) {
        console.log(err);
    },
    document.getElementById('canvas').getElementsByTagName("canvas")[0]
);

在Phonegap应用程序中下载Highchart图像

1 个答案: