9

I'd like to save an echart as an image. If the toolbox.saveAsImage option is set to true, I can use a toolbox action to save the chart. However, I'm wondering if this can be done programmatically?

APerson
  • 8,140
  • 8
  • 35
  • 49
cgat
  • 3,689
  • 4
  • 24
  • 38
  • 2
    According to the echarts 2.0 documentation there is an `option` parameter called `renderAsImage` which is a boolean (true|false). I think it renders the chart as an image instead of a canvas chart. Unfortunately, this parameter is completely gone from the echarts 3.0 documentation which tells me that it wasn't used as much, but I would still experiment around with version 2 and see what this can do and if supports a callback function which could enable saving the image to a path. – Anjan Biswas May 12 '17 at 22:32

2 Answers2

18

This should be achieved by echartsInstance.getDataURL, with which you can set image format, pixel ratio and so on.

(opts: {
    // Exporting format, can be either png, or jpeg
    type?: string,
    // Resolution ratio of exporting image, 1 by default.
    pixelRatio?: number,
    // Background color of exporting image, use backgroundColor in option by default.
    backgroundColor?: string,
    // Excluded components list. e.g. ['toolbox']
    excludeComponents?: Array.<string>
}) => string

See ECharts doc for more information.

Nitin Jadhav
  • 6,495
  • 1
  • 46
  • 48
Ovilia
  • 7,066
  • 12
  • 47
  • 70
4

If you have echart instance variable, use getDataURL method with params like this:

echartInstance.getDataURL({
    pixelRatio: 2,
    backgroundColor: '#fff'
});

Calling e.getDataURL() without options won't work.

Nitin Jadhav
  • 6,495
  • 1
  • 46
  • 48