uniapp在Vue页面中使用echarts绘制堆叠柱状图
想要在uniapp中使用echarts,需要进行以下操作步骤: 一:操作步骤 1.定义存放图表的div; 2.引入echarts.min,js,可以去echarts的官网“在线定制”; 3.在需要使用echarts的图表vue页面引入echarts.min.js; 4.开始使用echarts绘制图表,此案例是动态的给图表赋值。
具体代码如下: 定制js: test.vue页面
二:关于动态绘制图表调用接口的步骤 *方法一:*如上案例 1.把初始化图表和创建图表放在一个方法中ectest(dataparam,normal,ask,late,early),这个方法中的参数是要动态赋给图表的值; 2.再定义一个方法inc(),去调用后台返回数据的接口,然后在接口的回调中调用创建图表的方法ectest(dataparam,normal,ask,late,early),并给这些参数赋值,把图表中需要动态获取值的部分用以上参数替换。 方法二: 三:补充 uni.request({}).then(res=>{}),.then是回调接口返回的数据,并把数据赋值给图表
此案例是针对echarts的堆叠柱形图,其他的图表同样适用!!!
