更新记录

1.0.1(2025-07-10) 下载此版本

折线图,柱状图,仪表盘,饼图,纯UTS源码开发组件版


平台兼容性

uni-app(4.66)

Vue2 Vue3 Chrome Safari app-vue app-nvue Android iOS 鸿蒙
- - - - - - - - -
微信小程序 支付宝小程序 抖音小程序 百度小程序 快手小程序 京东小程序 鸿蒙元服务 QQ小程序 飞书小程序 快应用-华为 快应用-联盟
- - - - - - - - - - -

uni-app x(4.66)

Chrome Safari Android iOS 鸿蒙 微信小程序
- - - - - -

uniapp x UTS 纯源代码绘制

折线图(line)

initChart(){
    const xData: string[] = ['01小时','02小时','3小时','4小时','5小时','6小时','7小时','8小时','9小时','10小时'];
    const yData: number[][] = [
        [22,32,68,96,56,67,38,56,67,39],
        [12,36,28,16,46,37,68,16,27,89],
    ];
    this.obj = {
        xData: xData,
        yData: yData,
    } as UTSJSONObject
}

柱状图(bar)

init(){
    const xData: string[] = ['01小时','02小时','3小时','4小时','5小时','6小时','7小时','8小时','9小时','10小时'];
    const yData: number[][] = [
        [72, 32, 68, 26, 56, 67, 38, 56, 67, 39],
        [52, 62, 28, 16, 46, 37, 68, 16, 27, 89]
    ];
    const callEasyMethod = this.$refs['barRef'] as ComponentPublicInstance;
    callEasyMethod!.$callMethod('drawInit', xData, yData);
}

饼图(pie)

init(){
    this.pieDatas = [12,20,32,30,10,60];
}

仪表盘(gauge)

init(){
    this.seriesData = {
        data: 212,//值
        unit: 'V',//单位
        color: 'red',//指针的颜色
        maxValue: 230,//最大值
        fontSize: 18//字体大小
    } as UTSJSONObject;
}

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问