1、定义
option定义在data里面(如果后续某个事件内,改变了option里面的series[i].data的值,图表会自动刷新):
option_hsl 内容为echarts官网例子里面的定义option部分:series里面的data可以通过后台接口动态渲染
定义一个事件,来改变series[i].data的值,测试是否会自动刷新图表
点击前:
点击后:
2、使用:
- npm install --save echarts vue-echarts-v3
- 在使用的组件内引入 import IEcharts from ‘vue-echarts-v3/src/full.js’
一定要设置高度,不然统计图无法显示出来
<div :style="{600+'px'}">
<IEcharts
:option="option_hsl" //echarts官网案例里面的option部分的内容
:loading="loading1" //加载圈圈,值为true或false
:loadingOpts="chart_loading_options" //设置加载数据时候的文字和样式
:resizable="true" //是否自动更新视图
@ready="onEchartReady"
@click="onEchartClick" //点击统计图数据部分,触发
/>
</div>
参考链接:
https://blog.csdn.net/weixin_33970449/article/details/88767110
https://www.cnblogs.com/cag2050/p/7831452.html