更新记录

1.0.1（2025-09-08）

1. 增加鸿蒙支持
2. 增加echart接口调用、echart各种事件回调

1.0.0（2025-09-07）

1. echarts各种报表、图表

平台兼容性

uni-app(4.07)

uni-app x(4.07)

其他

ECharts各种报表图标，支持点击效果，点击、双击等各种事件，支持iOS/Android/harmony

集成步骤

1. 集成插件，集成插件步骤请参考 https://www.cnblogs.com/wenrisheng/p/18323027

文档

组件

<!--  #ifdef  APP-HARMONY -->
<embed :style="'width:'+width+'px;height:'+height+'px;'" tag="echarts" :options="options"
    @onechartsevent="onEchartsEvent"></embed>
<!--  #endif -->
<!--  #ifndef  APP-HARMONY -->
<wrs-uts-echarts ref='echarts' :params="params" :style="'width:'+width+'px;height:'+height+'px;'"
    @onLoadView="onLoadView" @onEchartsEvent="onEchartsEvent"></wrs-uts-echarts>
<!--  #endif -->

• 使用了该组件的页面需要用nvue或uvue
• 属性params是json格式的字符串 如需测试各类图标，在官网https://echarts.apache.org/examples/zh/index.html#chart-type-bar点击想要的图标，进入到图标详情，拷贝左边代码的option赋值到下面的params.params节点，可参考demo

let params = {
    business: "option",
    params: {
        xAxis: {
            type: 'category',
            data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
        },
        yAxis: {
            type: 'value'
        },
        series: [{
            data: [150, 230, 224, 218, 135, 147, 260],
            type: 'line'
        }]
    },
    toolbox:{
        feature:{
            saveAsImage:{
                show: false // 隐藏右上角的下载按钮
            }
        }
    }
};

///////////////
params: paramsStr, // ios、android
options: { // harmony
    params: paramsStr
}

• 事件onEchartsEvent

onEchartsEvent(e) {
    // android、ios、鸿蒙各端自己适配获取business参数，business表示事件类型
    console.log("onEchartsEvent:" + JSON.stringify(e))
    let business = ""
    let params = {}
    if (this.isAndroid) {
        business = e.detail.params.dynamicJSONFields.business
        params = e.detail.params.dynamicJSONFields.params.dynamicJSONFields
    } else {
        business = e.detail.params.business
        params = e.detail.params.params
    }
    console.log("业务business：" + business)
}

• 接口resize

let newParams = {
    business: "resize"
}

let newParamsStr = this.formatNewParams(newParams)
// android、ios
this.params = newParamsStr
// 鸿蒙
this.options = {
    params: newParamsStr
}

如需调用echarts更多接口请联系作者