wx charts

wx-charts

微信小程式圖表工具，charts for WeChat small app

基於canvas繪製，體積小巧

持續優化更新中，請保持關注~ 有任何問題歡迎在Issues中討論，提出issue前請先閱讀此須知

位元組跳動大量招募前端開發工程師（初級、高級、資深、Leader），坐標北京、上海、深圳、杭州、成都、武漢、廣州、南京，有興趣的朋友請點擊此處進行投遞

支援圖表類型

• 圓餅圖pie
• 圓環圖ring
• 線圖line
• 長條圖column
• area圖area
• 雷達圖radar

程式碼分析Here

更新記錄

• 動畫效能優化
• 圖表滾動的支持，感謝@jxintang
• 優化曲線繪製
• 新增雷達圖2017-03-17
• 新增tooltip 2017-03-07
• 新增曲線的繪製2017-03-06
• 新增更新資料、終止進行中的動畫方法，渲染完成事件回呼2017-02-17
• 新增圓環圖title, subtitle 2017-01-10
• x軸文案碰撞避讓2016-12-30
• add pie chart dataLabel 2016-12-19
• add animation 2016-12-05
• build with rollup 2016-12-02
• add legend 2016-11-29

如何使用

1.直接引用編譯好的檔案dist/wxcharts.js或dist/wxcharts-min.js

2、自行編譯

 git clone https://github.com/xiaolin3303/wx-charts.git
npm install rollup -g
npm install
rollup -c 或者 rollup --config rollup.config.prod.js

實際專案中如何具體使用wx-charts 或訪問wx-charts-demo查看在微信開發工具中直接運行的例子

參數說明

參數說明- wxCharts使用文檔

方法& 事件

方法& 事件- wxCharts使用說明

範例

更多內容請查看Example - wxCharts使用說明

測試

1. iPhone 6s, IOS 9.3.5
2. 小米4, ANDORID 6.0.1

相容性問題請在Issue中提出

一些問題的說明總結

• wx-charts自適應螢幕寬度的問題
• 專案中如何具體使用wxCharts