vue引入echarts
1、下载
npm install echarts --save
2、在main.js
全局引入
import Echarts from 'echarts'
Vue.prototype.echarts = Echarts
Vue.use(Echarts)
3、使用
3.1、在绘图前我们需要为 ECharts 准备一个具备高宽的 DOM 容器。
<template>
<div>
<div id="echarts" :style="{width: '300px', height: '300px'}"></div>
</div>
</template>
3.2、在echarts赋值你需要的图标代码
注:在赋值的代码中的option
前面加上let
,也就是讲此段代码赋值给一个叫option
的变量,方便我们使用。
3.3、在页面中使用,通过 echarts.init 方法初始化一个 echarts 实例并通过 setOption 方法生成一个简单的柱状图,下面是完整代码。
react使用echarts
1、下载
npm install --save echarts-for-react
npm install --save echarts
2、使用
注意:官网复制的代码option后面的“=”换成“:”