Echarts 官网
- Echarts
运用JS来实现开源可视化库的作用:
可以流畅的运行在 PC 和移动设备上,底层依赖矢量图形库 ZRender。 [官网地址](https://echarts.apache.org/zh/index.html)
Echarts的基本使用步骤:
一、安装:
安装只需要两步。1.下载echarts;2. 引入并注入main.js
注:在下载echarts时,大多情况会遇到安装不成功 或报错的问题。解决此类问题的方法:重装或安装之前的版本。
① 下载echarts
全局引入
② 引入并注册main.js文件
注:若以上引入出现报错情况,则可以尝试以下引入方法
到此,echarts的安装就OK了
_以上红色字体的内容是一个版本↑↑↑__ __ __ __ __ __ __ __ __ __ __ __ __ __ __ __ __ __ __
_以下黑色字体的内容是另一个版本↓↓↓__ __ __ __ __ __ __ __ __ __ __ __ __ __ __ __ __ __
第一步:下载并引入echarts.js文件
<script src="js/echarts.min.js"></script>
or
<script src="./js/echarts.min.js"></script>
二、使用:
( 将echarts安装引入后,接下来在项目中使用所安装引入的echarts )
第二步:准备一个具备宽高的DOM容器
① 为echarts准备一个具有宽高的div容器(即存放图表的一个占位)
<div id="container"></div>
or
<div id="main" style="width: 600px;height:400px;"></div>
第三步:初始化echarts实例对象
② 获取定义id并通过echarts.init()方法初始化echarts实例
var echart = echarts.init(document.getElementById("app"));
or