本文将为您描述如何解决 eharts.js报错 Uncaught TypeError: Cannot read property 'getAttribute' of null 的问题

根据报错信息查找原因发现是因为 实例化 echarts 的元素不存在(未找到指定的元素),查看官方文档发现:

// 基于准备好的dom,初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));

基于准备好的 dom,初始化 echarts 实例,也就是只有 页面存在的HTML元素 才可以去初始化。

解决方案:

HTML DOM getElementById() 方法 (通过 指定ID查找元素),在 初始化echarts 之前打印一下看看此元素是否存在

例:

console.log(document.getElementById('main'))

echarts js报错 Cannot read property 'getAttribute' of null的更多相关文章

  1. 在vue中使用echarts报错Cannot read property getAttribute of null

    报错信息如下: 报错代码: mounted() { // ... this.drwaCharts() // drawCharts方法为自己定义的包含渲染 echarts 图表的方法 // ...} 之 ...

  2. js执行函数报错Cannot set property 'value' of null怎么解决?

    js执行函数报错Cannot set property 'value' of null 的解决方案: 原因:dom还没有完全加载 第一步:所以js建议放在body下面执行, 第二步:window.on ...

  3. vue.config.js报错cannot set property "preserveWhitespace" of undefined

    vue.config.js报错cannot set property "preserveWhitespace" of undefined 最近在项目中配置webpack,由于vue ...

  4. hexo 报错 Cannot read property 'replace' of null

    详细错误信息: FATAL Cannot read property 'replace' of null TypeError: Cannot read property 'replace' of nu ...

  5. vue项目中使用echarts map报错Cannot read property 'push' of undefined nanhai.js

    在vue中绘制地图需要加载一个本地china.json文件,我用的是get请求的方法加载的,而不是直接import,因为我怕import请求到的部署到线上的时候会有问题.如下是get请求方法: thi ...

  6. 报错”Cannot read property 'addEventListener' of null“

    1.报错:Cannot read property 'addEventListener' of null 2.解决方案: 把代码放到window.onload=function(){...}里面,因为 ...

  7. 【jQuery学习】用JavaScript写一个输出多选框的个数报错:Cannot set property 'onclick' of null"

    说明:代码段来源于:<锋利的jQuery> 根据代码段我补充的代码如下: <!DOCTYPE html> <html> <head> <meta ...

  8. 小程序分享报错 Cannot read property 'apply' of null;at page XXX onShareAppMessage function

    Cannot read property 'apply' of null;at page XXX onShareAppMessage function 然后看了下自己的代码,分享按钮在子组件里, at ...

  9. echarts Cannot read property 'getAttribute' of null 问题的解决方法

    今天在使用echarts练习官方给的实例的时候,代码没有问题 却总是报错“Cannot read property 'getAttribute' of null” 找了好久的文档没有看明白 ... 最 ...

随机推荐

  1. Dynamic Code Evaluation:Unsafe Deserialization 动态代码评估:不安全反序列化

  2. 从零开始的vue学习笔记(六)

    混入 混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能.简单解释就是把一个Vue组件中的内容提供给别的组件来用.例子: // 定义一个混入对象 var myMixin ...

  3. Spring基础——配置文件pom.xml,web.xml,ApplicationContext.xml

    Spring配置文件——复制粘贴即用 为了以后兼容SSM框架,直接创建Maven Project,包结构如下图. pom.xml <project xmlns="http://mave ...

  4. Sqoop数据传递

    1.环境准备:打开Hadoop.Mysql jps cd /apps/hadoop/sbin ./start-all.sh sudo service mysql start mysql -u root ...

  5. [springMvc]常见配置

    [springMvc]常见配置 <?xml version="1.0" encoding="UTF-8"?> <beans xmlns=&qu ...

  6. C lang:Array and Pointer formal parameter

    Test Xx_Formal parameter Formal parameter are local variable. It's private to the function. Ax_Array ...

  7. 【Android】Android Studio NDK 开发

    Android Studio NDK 开发 记录在Android Studio中NDK简单开发的步骤 用到的Android Studio版本为3.5. 配置NDK 下载NDK 一般在SDK下已经有自带 ...

  8. Windows自动执行应用程序或脚本(可以通过写bat文件定时关机等)

    1. Windows每天定时执行某个应用程序 1.1 右键我的电脑选择管理,并选择任务计划程序,如下 演示 --- 1.2 创建基本任务 演示 1.3 Windows每天定时关机设置参数 演示 1. ...

  9. java.lang.IllegalStateException: Cannot call sendError() after the response has been committe

    1.问题描述 严重: Servlet.service() for servlet [default] in contextwith path [/OxygenCloud] threw exceptio ...

  10. Jmeter脚本录制攻略

    基于Apache JMeter(5.2.1) 首先在TestPlan里添加一个HTTP代理服务武器: 设置端口,在目标控制器里选择线程组. 在Chrome浏览器里设置代理: 点击启动按钮后,在浏览器登 ...