# Echarts组件封装指南

您可在ECharts官网 (opens new window)找到适合自己需求的图表,卡片插件中提供一些echarts公共方法的封装,让你更快速、更有效的进行卡片开发和拓展。

引入方式

<script>
import {  RenderChart } from '@aurora/cardbuilder-template-plugin'
export default {
  mixins: [RenderChart]
}
</script>

具体方法使用

 /**
 * @description 图表初始化
 * @param {Object} chartRef 图表组件实例
 * @param {Object} echartTheme 图表主题
 * @param {Boolean} isShowSvg 是否以svg类型展示
 * @param {Function} callback 数据响应后,需要执行的回调函数
 */
this.initChart(this.$refs.chartRef, this.echartTheme, newValue)
/**
 * @description 图表自适应处理
 */
this.resize()
/**
 * @description 销毁图表实例
 * @param {Object} chartRef 图表组件实例
 */
this.destoryEchart(this.$refs.chartRef)
/**
 * @description 设置图表配置项
 * @param {Object} options 图表配置对象
 * @param {Boolean} isUpdateData 是否更新数据,true为更新数据,false则合并数据
 * @param {Function} callback 数据响应后,需要执行的回调函数
 */
this.setOption(option,true,callback)
/**
 * @description 清除轮播时间
 */
this.clearIntervalTimer()
/**
 * @description 初始化定时调度
 * @param {Number} updateTime 刷新频率
 * @param {Boolean} refreshSwitch 定时开关
 * @param {Function} callback 定时执行的回调函数
 */
this.ifFresh(updateTime, refreshSwitch, callback)
 /**
 * @description 定时调度
 * @param {Number} time 刷新频率
 * @param {Function} callback 定时执行的回调函数
 */
this.refresh(time, callback)
/**
 * @description 清除定时器
 */
this.destroyTimer()
更新时间: 4/2/2021, 11:27:41 AM