Vue引入echarts-wordcloud报错

zjy9762 2021-04-16 02:53:04

代码：<script>
import echarts from "echarts";
import "./echarts-wordcloud-master/dist/echarts-wordcloud";
import "./echarts-wordcloud-master/dist/echarts-wordcloud.min";
export default {
name: "VueWordCloud",

报错：Uncaught TypeError: o.helper.createTextStyle is not a function
at Object.t.layoutInstance.ondraw (echarts-wordcloud.min.js:2)
at HTMLCanvasElement.g (echarts-wordcloud.min.js:2)
at eval (echarts-wordcloud.min.js:2)
at Array.some (<anonymous>)
at D (echarts-wordcloud.min.js:2)
at e (echarts-wordcloud.min.js:2)

不太懂为啥，VScode不报错，界面调试出现这样错误，不显示。

...全文

813 3 打赏收藏转发到动态举报

写回复

3 条回复

切换为时间正序

请发表友善的回复…

发表回复

ZepngLin 2021-08-08

打赏
举报

回复 1

升级到echarts-wordcloud 2.0, echart5不兼容1版本

28岁学前端-渣仔一枚 2021-07-13

打赏
举报

回复

我的也是，解决了吗

淼羴 2021-07-02

打赏
举报

回复

我的也是这样。

最后我在想，要不要看看node安装包里的echarts-wordcloud包里的README.md，看看里面是怎么写的，说不定有答案。今天在nuxt3.js项目中引入echarts5版本和echarts-wordcloud报错，被折磨的要疯掉，必须记录一下~~~~(>_<)~~~~网上查了很多解决方案，按照指示一步一步的排查，echarts-wordcloud版本删了装，装了又删，还是还是不行…// await import('echarts-wordcloud');// // 初始化你的图表...

现在是2023.10.26,笔者使用的echarts版本是5.3，echarts-wordcloud版本是2.1.0，按照官网的方式引入了worldcloud，type=wordCloud之后发现不显示，浏览器报错series.wordcloud not exists,load it first，但是echarts本身的诸如饼状图（type=pie）之类的可以正常显示。一开始以为是版本不匹配的问题，因为按照官方说法echarts-wordcloud2适配echarts5，echarts-wordcloud1

【代码】【Nuxt3】安装引入 echarts-wordcloud 报错 window is not defined 解决方法。

开始echarts样式如下图，显示正常。后面一段时间测试提出echarts这部分不显示数据了。筛查之后发现有报错如下：解决： echarts2.0版本之后不再在引入的echarts中支持wordCloud,需单独引入。引入原js或者min都可以 js引入文件地址：点击下载wordCloud引入文件提取码: 54wn import wordCloud from "../../echarts-wordcloud.min.js"; ...

在vue中使用echarts，首先要npm i echarts(未指定版本，目前默认安装5.0）安装一下echarts，然后在main.js入口文件中引入并挂载echarts，我就想当然的使用了如下引入方式：然后使用的时候，就一直说$echarts未定义，就一直找博客看看别人是怎么解决的。知道我找到这个文章：VUE引用和使用echarts4/echarts5的差别。报错原因： echarts插件中没有wordCloud依赖包。 Vue echarts-wordcloud使用技巧总结+避坑这篇文章，已

其他技术专区

28

社区成员

1,219

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章