小程序 echarts组件 图表 监听点击事件 触摸事件 (组件: uni-ec-canvas)

组件下载:

链接:https://pan.baidu.com/s/1Q43zRCQeauSsOpAknx98Bw
提取码:5vls

有修改了原组件。

调用:

import uniEcCanvas from "@/components/uni-ec-canvas/uni-ec-canvas";

 

tapIndex:点击或者触摸了哪一项,
<uni-ec-canvas
     v-on:tapIndex="tapIndex2"
     class="uni-ec-canvas"
     id="line-chart1"
     canvas-id="multi-charts-line"
     :ec="ec2">
</uni-ec-canvas>

方法

tapIndex2(e) {
   console.log(e);//e是点击
 },

图表初始化  echarts对应属性没变,只是设置渐变无效,这个功能还在修改中

ec2: {
                    option: {
                        tooltip: {
                            formatter: '{a} <br/>{b} : {c}%'
                        },
                        toolbox: {
                            feature: {
                                restore: {},
                                saveAsImage: {}
                            }
                        },
                        series: [{
                            name: '业务指标',
                            type: 'gauge',
                            detail: {
                                formatter: '{value}%'
                            },
                            data: [{
                                value: 50,
                                name: '完成率'
                            }]
                        }]
                    }
                },

 

posted @ 2022-01-24 16:55  凉面好好吃  阅读(2355)  评论(0编辑  收藏  举报