微信小程序中使用图标插件wx-charts

github地址:https://github.com/xiaolin3303/wx-charts.git;

wx-charts基于canvas绘制,支持图表类型:饼图 pie,圆环图 ring,线图 line,柱状图 column,区域图 area,雷达图 radar

  1. 直接引入编译好的文件 dist/charts.js.
let Charts = require('./../../utils/wxcharts.js');
  1. 在.wxml中定义:

canvas-id与new wxCharts({canvasId:”})中canvasId一致

<canvas canvas-id="myCanvas"></canvas>

数据列表series的参数:
data:数据
color:颜色
name:数据名称
format:Function 自定义显示数据内容

new Charts({
     canvasId: 'myCanvas',
     type: 'pie',
     series: [{ name: '一班', data: 50 }, { name: '二班', data: 30 }, { name: '三班', data: 20 }],
     width: 640,
     height: 400,
     dataLabel: true,
   });

猜你喜欢

转载自blog.csdn.net/wsln_123456/article/details/88825754
今日推荐