echarts 部分类型的图表报错--not exists. Load it first.

最新推荐文章于 2023-09-14 15:42:15 发布
最新推荐文章于 2023-09-14 15:42:15 发布
阅读量266 收藏
点赞数
分类专栏： 前端 文章标签： echarts 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44386456/article/details/132366245
版权

问题描述

浏览器控制台报错;Uncaught Error: Component series.graph not exists. Load it first.

问题分析

百度一番,有说导入顺序有问题,有说版本有问题
切换了几个版本,问题没解决
使用npm安装方式,又提示echarts is not defined

看看引用的代码,在引用的代码中找graph,是有这个的,说明版本没问题,但是不知为何引用不了
在这里插入图片描述

解决方案

再次百度,找到一个老哥的博客,发现可能是包不全
博客
然后换成了当前版本的echarts.min.js包可行
查看里面的graph,发现有4个,确实是包不全
在这里插入图片描述

weixin_44386456
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
echarts-gl.min.js
04-06
报错“Component series.bar3D not exists. Load it first.”时下载并引用
Vue中使用echarts报错类似于vue Error: Component series.gauge not exists. Load it first错误
qq_41742576的博客
01-17 1872
1、查看版本，有可能是因为版本不兼容导致的。 2、修改引入方式 由 import echarts from "echarts/lib/echarts"; 改为 import echarts from "echarts"; 3、在方法2的基础上引入相应类型 import 'echarts/lib/chart/gauge';
echarts刷新不显示 报错Component series.pictorialBar not exists. Load it first
weixin_51565477的博客
07-28 1036
× Error: Component series.line not exists. Load it first. 错误引入 import echarts from "echarts/lib/echarts" import 'echarts/lib/chart/bar' import 'echarts/lib/component/tooltip' 正确 import 'echarts/lib/chart/bar' import 'echarts/lib/component/tooltip' import
vue+echarts 象形柱图 pictorialBar 错误信息 Component series.pictorialBar not exists. Load it first
扬帆前行
08-11 2124
1、问题 ：当我引入echarts象形柱图实现ui的设计图时，发现echarts的图标出不来并且浏览器报错信息显示Component series.pictorialBar not exists. Load it first， 2、解决过程：我排查我的引入的echarts方法无误之后我感觉上是echarts的版本问题，更新了echarts的版本发现并没什么卵用，冷静思考了下 上面这个报错信息产生的原因（这就是因为setOption的时候传入的option中的series和接收的不一致）将type:'pic
echarts与echarts-gl、echarts-liquidfill版本兼容问题，报Component series.XXX not exists. Load it first.
gather_info的博客
06-13 2299
echarts与echarts-gl、echarts-liquidfill版本兼容问题，报Component series.XXX not exists. Load it first.
数据大屏踩坑（echarts）
weixin_45392774的博客
09-21 880
echarts
react-component-echarts:React component echarts. 组件式百度图表
05-14
React Component Echarts ...由于全部的图表和组件 ECharts 包体积会比较大，所以react-component-echarts只引入ECharts主模块，对于依赖的图表和组件，需要自己手动引入，这样可以有效减小打包后的体积，下面
apache-phoenix-4.8.1-HBase-1.2-bin.tar.gz
08-16
2. **创建表**：使用SQL语句创建HBase表，如`CREATE TABLE IF NOT EXISTS my_table (id VARCHAR PRIMARY KEY, data VARCHAR);` 3. **插入数据**：使用INSERT语句向表中插入数据。 4. **查询数据**：执行SELECT语句...
Judge-whether-a-file-exists.rar_vb exists
09-24
标题"Judge-whether-a-file-exists.rar_vb exists"暗示了这是一个关于使用VB来检查文件是否存在的示例代码。下面我们将深入探讨如何使用VB实现这一功能，以及相关的知识点。 首先，VB提供了`My.Computer.FileSystem...
vsdbg-linux-x64.zip
12-02
解决vs2019使用docker发布和调试时,出现vsbdg\vs2017u5 exists deleting错误，一共需要2个文件，vsdbg-linux-x64.zip和vsdbg-linux-musl-x64.zip，这是其中之一。原厂下载实在是太慢了，注意这里适用的版本是vsdbg-...
Angular学习笔记47：解决Echart报错：ERROR Error: Component series.line not exists. Load it first.等问题
W先生
06-17 1万+
早晨起来，打开项目的，发现原来项目中好用的Echart 所有图表都不显示了。打开控制台发现，所有的报错了。 报错信息如下： ERROR Error: Component series.line not exists. Load it first. ERROR TypeError: Cannot read property ‘seriesTaskMap’ of null. 等信息。 ERROR Er...
Uncaught (in promise) Error: Component series.map not exists. Load it first
游海东的技术专栏
12-12 1万+
1、错误描述 Uncaught (in promise) Error: Component series.map not exists. Load it first. at Function.entity.getClass (clazz.js:178) at ExtendedClass.<anonymous> (Global.js:223) at Array.forEach (&...
echarts异步加载柱状图遇到的错误- Error: Component series. not exists. Load it first.
weixin_30894583的博客
12-21 665
今天看了下echarts教程之中的异步加载柱状图，我按照教程中的代码敲出来之后再运行，就报了一个 Error: Component series. not exists. Load it first. 的错误，话不多说，教程中的代码如下所示： 1 function fetchData(cb) { 2 // 通过 setTimeout 模拟异步加载 3 s...
vue引入echart错误提示Error in mounted hook: “Error: Component series.line not exists. Load it first...
coldriversnow的专栏
04-20 1273
安装 npminstallvue-echarts 在vue中引入vue-echarts组件的时候报错了，如下图 Error in mounted hook: "Error: Component series.line not exists. Load it first 解决方法 找到vue-echarts下的components>echarts.vue importechartsfrom'echarts/lib/echarts' 改为 importecharts...
记录使用echart遇到的错误
maple_leaf_red的博客
10-24 5903
记录使用echart遇到的错误
echarts水球图报错问题Component series.liquidFill not exists. Load it first
最新发布
weixin_57569836的博客
09-14 1292
我在运行npm install 安装的时候报错 ：warning @vue/cli-plugin-babel > webpack > watchpack > chokidar > fsevents@2.1.3: "Please update to latest v2.3 or v2.2"再报错的话，就重启项目，或者再次删除node_modules 和 package-lock.json.再次安装，然后重启项目。解决办法：先检查echarts 和 echarts-liquidfill 是否安装。
在React中使用Echarts报错Error: Component series.pie not exists. Load it first.并且出现无法使用的情况
热门推荐
水镜先生的博客
06-19 1万+
Echarts 今天做项目的时候想在React页面添加一个饼状的一个统计图,但是到处遇坑,花了一个小时时间终于解决了这个问题,但是怕忘记所以来这里充电,记录以免以后再次发生相同的错误,今天想使用一下Echarts,但是官方的文档中并未有Echarts在React中使用的文档,这使我十分苦恼,React这么牛,现在都没有教程,心伤伤(这里小小的吐槽一下),于是只能自己写一个来加强记忆了,在网络上直接...
Echarts使用树图报错：Component series.tree not exists. Load it first.
code_mzh的博客
08-08 920
这是报错： 不用cdn就要下载好js 没别的，就是下载，github快：点击这下载 方式一：全下载 下载后找到echarts.js!!! 别用echarts.common.js,这是基础的，没树图！！！ 方式二：觉得麻烦也可以只下载echarts.js 1.点进dist 2.下载echarts.js 然后就是导入使用了 <script type="text/javascript" th:src="@{/lib/echarts/echarts.js}" src="lib/echarts/echa
echarts 报错 —— Component series.map not exists. Load it first
朝阳39的博客
08-31 2697
原因：使用了简化版的echarts webpack.config.dev.js 中路径别名引用了简化版的echarts resolve: { extensions: ['.js', '.vue'], alias: { '@': path.resolve(__dirname, './src'), 'vue': 'vue/dist/vue.common', // 路径别名引用了简化版的echarts 'echar.
百度echart--Uncaught Error: Component series.wordCloud not exists. Load it first.
05-29
这个错误通常是由于在使用 ECharts 时没有正确加载 wordCloud 组件导致的。要解决这个问题，你需要在 ECharts 的配置中加入以下代码来加载 wordCloud 组件： ```javascript // 引入 ECharts 主模块 var echarts = require('echarts/lib/echarts'); // 引入柱状图组件 require('echarts/lib/chart/wordCloud'); // 引入提示框和标题组件 require('echarts/lib/component/tooltip'); require('echarts/lib/component/title'); // 使用柱状图组件 echarts.init(dom).setOption(option); ``` 这段代码中，我们首先引入了 ECharts 主模块，然后分别引入了 wordCloud、tooltip 和 title 组件。最后，我们通过 `echarts.init(dom).setOption(option)` 使用了柱状图组件。这样就可以正常使用 wordCloud 组件了。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值