vue3 使用npm方式引入echarts,图表option里legend使用了icon字段,并且使用base64方式引入图片,报错:Image is not defined,最终查找在npm引入的echarts中存在new Image()导致报错
![宇林](http://img-cdn-tc.dcloud.net.cn/uploads/avatar/001/87/24/85_avatar_mid.jpg?v=1698737428)
- 发布:2024-07-02 13:49
- 更新:2024-07-03 10:06
- 阅读:55
![](http://img-cdn-tc.dcloud.net.cn/uploads/questions/20240702/a4e481b5bd1847d9ccbf940b6abc3299.png)
![DCloud_heavensoft](http://img-cdn-tc.dcloud.net.cn/uploads/avatar/000/00/00/16_avatar_mid.jpg?v=0)
非web是运行在js引擎里,而不是运行在浏览器里,不支持new image(),要使用https://uniapp.dcloud.net.cn/api/canvas/CanvasContext.html#canvascontext-drawimage
插件市场有很多已经适配好的chart组件,自己调整原版for web的echart会遇到很多麻烦。
-
宇林 (作者)
插件市场的chart我看了很多,vue3使用echart都是使用npm方式引入,我原先是vue2项目,使用renderjs绘制图表,为了后期适配鸿蒙,升级项目为vue3,发现使用renderjs绘制图表报错,插件市场并未看到关于vue3使用renderjs绘制echarts的案例,自己也没搞出来,所以使用上述方式。
2024-07-03 09:26
![哈哈柚](http://img-cdn-tc.dcloud.net.cn/uploads/avatar/000/57/81/08_avatar_mid.jpg?v=1650937048)
https://echarts.apache.org/handbook/zh/how-to/cross-platform/wechat-app
可以试试看echarts官网提供的这个跨平台方案是否可行