bs-ui-echarts

Base Readme

这个项目是从bs-ui-seed基础创建出来的. 请查看base/README.md 来了解其基础内容.

基于百度echarts的小程序图表组件。

功能介绍

• 基础图表功能
• touch事件修正
• 微信版本检测
• ios 兼容性

使用方法

1. 安装

npm i bs-ui-echarts

2. .json

"usingComponents": {
    "bs-echarts": "miniprogram_npm/bs-ui-echarts/index"
  }

3. .wxml

<bs-echarts
    canvas-id="chart-id"
    chart-height="500rpx"  // chart 高度, optional 默认为100%
    option="{{yourChartOptions}}"
/>

4. .js

data: {
    yourChartOptions: null
},

onReady() {
    // 显示chart
    this.setData({
        options: yourChartOptions  // options：null 表示隐藏chart,显示no data提示
    });
}

实例

参见 exmple 文件夹

更新日志

详见 Change log

接口说明

Properties

Property	Type	Required	Default Value	Comments
canvasId	String	required	--	canvas id
option	Object	required	--	echart 选项,数据变化会重新触发加载
ec	Object	optional	{ lazyLoad: true }	自定义扩展选项. 其他配置项参见下面详细介绍(ec 配置项).
componentHidden	Boolean		true
chartHeight	String	required	360rpx	chart 的高度, 需传入单位
noDataHeight	String	optional	360rpx	nodata 的高度

ec 配置项

Name	Default Value	Comments
lazyLoad	true	延迟调用
disableTouch	false	是否禁用触摸

Events

Event	Required	Comments
chartready	optional	在chart ready 后进行调用,返回chart对象，可用于注册click等事件