wepy 小程序 echarts 搭配使用

最新推荐文章于 2024-08-16 10:31:11 发布

yaoxiewan6617

最新推荐文章于 2024-08-16 10:31:11 发布

阅读量4.1k

点赞数

文章标签： wepy echarts 小程序

本文链接：https://blog.csdn.net/yaoxiewan6617/article/details/79420524

版权

本文介绍了如何在微信小程序中利用wepy框架与echarts库进行结合，实现数据可视化效果。通过配置wepy组件，导入echarts模块，并设置图表配置项，展示了在小程序环境下创建动态更新的图表实例。

摘要由CSDN通过智能技术生成

组件:

canvas-id不能自定义貌似是wepy的原因

<style>
</style>
<template>
  <canvas class="ec-canvas" canvas-id="eChart" ></canvas>
</template>
<script>
  import wepy from 'wepy'
  import * as echarts from '../plugins/ec-canvas/echarts'
  import WxCanvas from '../plugins/ec-canvas/wx-canvas'
  export default class ecCanvas extends wepy.component {
    props = {
      ec: {
        type: Object
      },
      canvasId: {
        type: String,
        default: 'eChart'
      }
    }
    data = {
      ec: null,
      canvasId: null,
      chart: null
    }
    onLoad() {
      const version = wx.version.version.split('.').map(n => parseInt(n, 10))
      const isValid = version[0] > 1 || (version[0] === 1 && version[1] >= 9)