echarts版本v5.0.1
配置toolbox.feature.saveAsImage. pixelRatio:保存图片的分辨率比例,默认为1,即默认分辨率跟exchart所在DOM相同大小,如果需要保存更高分辨率的,可以设置为大于 1 的值,例如 2。
toolbox: {
show: true,
feature: {
saveAsImage: {
pixelRatio: 2,
},
}
}
配置后发现点击下载图片报错。Uncaught TypeError: Cannot read property 'dpr' of undefined at setContextTransform (graphic.js:378)
官网上示例配置为2下载是成功的,但是本地失败,检查拼写无误并且尝试配置pixelRatio为1就能够下载成功。只有看excharts源码打断点调试,最后发现是echarts的bug:在CanvasPainter渲染canvas时,初始化ctx(initContext)之前先取用了ctx。
当渲染Canvas时,如果设置的pixelRatio大于默认值1的时候,会根据ctx绘制canvas画布,ctx是undefined因此报错。见截图:这个文件路径在:/node_modules/zrender/lib/canvas/Painter.js
解决办法:将602行和603行顺序互换,保存重新运行,导出成功。
发现官网最新的版本是5.1.0更新了一下版本发现果然这个问题修复了。因此,可以手动改一下painter代码,或者是直接更新5.1.0版本吧