本文将为您描述如何解决 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. Django-如何写好一个celery定时任务

    1.首先在项目同名目录下建一个celery.py from __future__ import absolute_import import os from celery import Celery ...

  2. 大话设计模式Python实现-迭代器模式

    迭代器模式(Iterator Pattern):提供方法顺序访问一个聚合对象中各元素,而又不暴露该对象的内部表示. 下面是一个迭代器模式的demo: #!/usr/bin/env python # - ...

  3. Java基础语法06-面向对象-继承

    七.继承 多个类中存在相同属性和行为时,将这些内容抽取到单独一个类中,那么多个类中无需再定义这些属性和行为,只需要和抽取出来的类构成继承关系. 继承的好处 提高代码的复用性. 提高代码的扩展性. 类与 ...

  4. 算法设计与分析——n后问题(回溯法+位运算)

    一.问题描述 在n×n格的国际象棋上摆放n个皇后,使其不能互相攻击,即任意两个皇后都不能处于同一行.同一列或同一斜线上,问有多少种摆法. 二.算法设计 解n后问题的回溯算法描述如下: #include ...

  5. centos开启ftp服务

    新安装的要先配置网络 $_> vi /etc/sysconfig/network-scripts/ifcfg-eno16777736 最后一行 onboot = yes $_> yum i ...

  6. 线程join方法详解

    执行逻辑:在当前代码块(比如main方法)中的线程A执行了join方法, 那么当代码块(main)执行到join方法时,会停止继续向下执行,一直到线程A执行完毕, main方法才会继续向下执行. 代码 ...

  7. 第03讲 fragment

    Fragment 官网文档:https://developer.android.google.cn/guide/components/fragments 什么是Fragment 在手机上,Activi ...

  8. Windows相关操作(备忘)

    查看服务端口是否能通:telnet 192.168.1.11 8888 查看端口是否被占用 netstat -ano

  9. 【好书推荐】《剑指Offer》之硬技能(编程题1~6)

    本文例子完整源码地址:https://github.com/yu-linfeng/BlogRepositories/tree/master/repositories/sword 前一篇<[好书推 ...

  10. Linux各目录的意义

    目录层次表准FHS FHS(Filesystem Hierarchy standard) FHS定义两层规范:1.“/”目录下的各个目录应该放什么文件数据 2.针对/usr /var两个目录的子目录来 ...