Highcharts - 出口到base64

Question

有没有办法获取高图图表,并获得它的base64表示？

换句话说,相当于首先将其导出为PNG或JPG(我不关心哪个),然后获取该图像的base64字符串.

Answer 1

这是我如何解决它:

• 使用google canvg 它获取SVG文件的URL或SVG文件的文本,在JavaScript中解析它,并在Canvas元素上呈现结果.

• 使用将您的图表svg渲染到画布

   canvg(document.getElementById('canvas'),getSVG());
  

• 将画布中的内容转换为图像

    var canvas = document.getElementById("canvas") ; 
    var img = canvas.toDataURL("image/png"); //img is data:image/png;base64
     img = img.replace('data:image/png;base64,', '');
  

• 将图像渲染到隐藏的字段

    $("hidden field").val(img) ;
  

• 将此字符串转换为字节数组

   Dim imageFile() As Byte = Convert.FromBase64String(YOUR HIDDEN FIELD .Value)
  

UPDATE

得到highcharts SVG

• 使用该chart.getSVG()方法

Highcharts API

jsFiddle示例

• 或者只是使用 $(your svg).html()