wechat-slideBarChart

小程序滑动定位柱状图表组件

效果演示

功能 左右滑动,图表进行位移,片刻自动进行位置矫正,当前展示数据更新 在Android iOS 测试,功能可用 使用 复制 component 下的 slideBarChart 文件夹到自己项目中 配置对应 page 页面的 json文件

{ "usingComponents": { "slideBarChart":"../../component/slideBarChart/slideBarChart" } }

3.page页面引入对应组件,配置对应属性

组件属性
属性名称 格式 作用
chartData json数组 渲染图表所需的数据
xName 属性名 chartData中的x轴展示的属性名
yName 属性名 chartData中的柱状图每个展示的值属性名
bindcurrentBarChange 自定义事件名称 当组件滑动变化时触发该事件,并返回当前展示的数据
注意 没有使用canvas方法实现(因为小程序使用原生canvas组件,在滑动页面不友好),但view组件的堆叠对于页面渲染的性能有损耗 标签的class名尽量不要动,如果修改请注意同步修改在js文件中获取标签宽度的class名,否则会造成偏移 若想修改样式直接定位到组件的每个css样式,自定义修改即可 ip5等手机仍然存在偶尔卡顿现象,暂时没有完全解决 欢迎提issue

版权声明:

1、该文章(资料)来源于互联网公开信息,我方只是对该内容做点评,所分享的下载地址为原作者公开地址。
2、网站不提供资料下载,如需下载请到原作者页面进行下载。