本文将为您描述如何解决 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. 解决JRebel对myBatis Mapper 失效的问题

    解决JRebel对myBatis Mapper 失效的问题 在之前的文章中介绍了JRebel这个插件的使用和优势,虽然它对配置文件的改动的热更新是生效的,但是mybatis的mapper文件的改动却无 ...

  2. IT兄弟连 HTML5教程 CSS3属性特效 小结及习题

    本章小结 CSS3新增了许多属性,CSS3样式新增了一种颜色模式rgba用来制作透明色,比CSS的颜色模式多了一个透明度的设置.文字的CSS3特效有文字阴影.文字描边.文字排版和文字省略等.另外,CS ...

  3. pandas 初识(六)-可视化

    Pandas 在一张图中绘制多条线 import pandas as pd import numpy as npimport matplotlib.pyplot as plt df = pd.Data ...

  4. JavaScript设计模式基础(一)

    模式的起源 模式 起源于建筑学.20世纪70年代,哈佛大学建筑学博士Christopher Alexander和他的团队花大约20年,来研究为解决同一个问题而设计出的不同建筑结构,从中发现那些高质量设 ...

  5. Kali Linux configuration "Ettercap"

    Xx_Instroduction Ettercap is a man-in-the-middle attack(MITM) tool,kali take this tool,so,use front ...

  6. Android框架式编程之Retrofit

    一.Retrofit 简介 Retrofit 官网地址: https://github.com/square/retrofit Retrofit(即Retrofit,目前最新版本为2.6.0版本),是 ...

  7. 12c新特性 在线操作数据文件

    我们都知道,oracle pre-12c之前,若是想要把一个数据文件改名或者迁移, 必须在归档模式下先把这个数据文件offline之后, 然后进行OS上的copy或者rename 操作, 最后在sql ...

  8. 原创【cocos2d-x】CCMenuItemToggle 在lua中的使用

    说明:1,所使用的cocos2dx版本为2.1.3 ;09:48:05 2,本人仍是在学习中的小菜鸟,此博客只是为了记录我学习过程中的点滴,同时也希望同样lua开发的童鞋,一起交流: 3,本人whj0 ...

  9. 如何获取Html的height和width属性(网页宽、高)

    1.页面如图所示 2.Html代码 <div style="color:green;" id="html_info"></div> 3. ...

  10. springboot之jpa的支持

    1.springboot之jpa支持 2.Springboot+bootstrap界面版之增删改查及图片上传 springboot之jpa支持 导入相关pom依赖 <dependency> ...