更新记录

1.0.5（2024-01-03） 下载此版本

Fix getAttribute错误

1.0.4（2023-12-07） 下载此版本

更新Readme正确的演示示例

1.0.3（2023-12-05） 下载此版本

Fix App示例

平台兼容性

ui-echarts

基于百度开源的echarts封装的uni-app跨端可视化图表库, 兼容App、H5、小程序等平台

平台兼容

其它平台未测试。

main.js

import uiEcharts from '@/uni_modules/ui-echarts'
Vue.use(uiEcharts)

用法

<view>
    <ui-echarts ref="chart" :option="option" exportBase64></ui-echarts>
    <image v-if="image" :src="image"></image>
    <button type="primary" size="mini" @click="toImage">导出图片</button>
</view>

export default {
    data () {
        return {
            image: null,
            option: {}
        }
    },
    onReady() {
        this.option = {
            grid: {
                right: 20
            },
            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'
            }]
        }
    },
    methods: {
        toImage () {
            this.$refs?.chart.toImageFile({
                /**
                 * tempFilePath 图片路径, H5导出也是base64
                 * base64 图片base64
                 */
                success: ({ tempFilePath, base64 }) => {
                    this.image = base64;
                }
            })
        }
    }
}

Props