参考地址：/xiaolin3303/wx-charts/issues/58
1.先看效果，如果是想要的在继续
2.wxml 一些案例
<!--pages/wxcharts/wxcharts.wxml--><canvas canvas-id="pieCanvas" disable-scroll="true" class="canvas"></canvas><canvas canvas-id="ringCanvas" disable-scroll="true" class="canvas canvas2"></canvas><canvas canvas-id="lineCanvas" disable-scroll="true" class="canvas"></canvas><canvas canvas-id="columnCanvas" disable-scroll="true" class="canvas"></canvas><canvas canvas-id="areaCanvas" disable-scroll="true" class="canvas"></canvas><canvas canvas-id="radarCanvas" disable-scroll="true" class="canvas canvas2"></canvas>
3.wxss 大小空间限制
/* pages/wxcharts/wxcharts.wxss */.canvas {width: 750rpx;height: 500rpx;}.canvas2{height: 400rpx;}
4.js与js插件导入(须自己下载wxcharts.js，可前往/xiaolin3303/wx-charts/tree/master/dist，下载)
// pages/wxcharts/wxcharts.js//首先引入wxcharts.js插件var wxCharts = require("../wxcharts.js");//定义记录初始屏幕宽度比例，便于初始化var windowW=0;Page({/*** 页面的初始数据*/data: {},/*** 生命周期函数--监听页面加载*/onLoad: function (options) {// 屏幕宽度this.setData({imageWidth: wx.getSystemInfoSync().windowWidth}) ;console.log(this.data.imageWidth) ;//计算屏幕宽度比列windowW = this.data.imageWidth/375;console.log(windowW);},/*** 生命周期函数--监听页面显示*/onShow: function () {// pieCanvasnew wxCharts({animation: true, //是否有动画canvasId: 'pieCanvas',type: 'pie',series: [{name: '成交量1',data: 15,}, {name: '成交量2',data: 35,}, {name: '成交量3',data: 78,}],width: (375 * windowW),height: (250 * windowW),dataLabel: true,});// ringCanvasnew wxCharts({animation: true,canvasId: 'ringCanvas',type: 'ring',extra: {ringWidth: 25,pie: {offsetAngle: -45}},title: {name: '70%',color: '#7cb5ec',fontSize: 25},subtitle: {name: '收益率',color: '#666666',fontSize: 15},series: [{name: '成交量1',data: 15,stroke: false}, {name: '成交量2',data: 35,stroke: false}, {name: '成交量3',data: 78,stroke: false}, {name: '成交量4',data: 63,stroke: false}],disablePieStroke: true,width: (375 * windowW),height: (200 * windowW),dataLabel: false,legend: false,padding: 0});//lineCanvasnew wxCharts({canvasId: 'lineCanvas',type: 'line',categories: ['-1', '-1', '-1', '-1', '-1', '-1', '-1', '-1', '2024-1', '2025-1', '2026-1'],animation: true,background: '#f5f5f5',series: [{name: '成交量1',data: [16, 12, 15, 11, 13, 17, 18, 16, 15, 14],format: function (val, name) {return val.toFixed(2) + '万';}}, {name: '成交量2',data: [2, 0, 0, 3, null, 4, 0, 0, 2, 0],format: function (val, name) {return val.toFixed(2) + '万';}}],xAxis: {disableGrid: true},yAxis: {title: '成交金额 (万元)',format: function (val) {return val.toFixed(2);},min: 0},width: (375 * windowW),height: (200 * windowW),dataLabel: false,dataPointShape: true,extra: {lineStyle: 'curve'}});//columnCanvasnew wxCharts({canvasId: 'columnCanvas',type: 'column',animation: true,categories: [2001,2002,,,],series: [{name: '成交量',data: [15.00,20.00,45.00,37.00],format: function (val, name) {return val.toFixed(2) + '万';}}, {name: '成交量',data: [6.00, 9.00, 20.00, 45.00],format: function (val, name) {return val.toFixed(2) + '万';}}],yAxis: {format: function (val) {return val + '万';},title: 'hello',min: 0},xAxis: {disableGrid: false,type: 'calibration'},extra: {column: {width: 15}},width: (375 * windowW),height: (200 * windowW),});//areaCanvasnew wxCharts({canvasId: 'areaCanvas',type: 'area',categories: ['1', '2', '3', '4', '5', '6'],animation: true,series: [{name: '成交量1',data: [32, 45, 0, 56, 33, 34],format: function (val) {return val.toFixed(2) + '万';}}, {name: '成交量2',data: [15, 20, 45, 37, 4, 80],format: function (val) {return val.toFixed(2) + '万';},}],yAxis: {title: '成交金额 (万元)',format: function (val) {return val.toFixed(2);},min: 0,fontColor: '#8085e9',gridColor: '#8085e9',titleFontColor: '#f7a35c'},xAxis: {fontColor: '#7cb5ec',gridColor: '#7cb5ec'},extra: {legendTextColor: '#cb2431'},width: (375 * windowW),height: (200 * windowW),});//radarCanvasnew wxCharts({canvasId: 'radarCanvas',type: 'radar',categories: ['1', '2', '3', '4', '5', '6'],series: [{name: '成交量1',data: [90, 110, 125, 95, 87, 122]}],width: (375 * windowW),height: (200 * windowW),extra: {radar: {max: 50}}});},})
5.部分参数说明
6.说明
（1）推荐地址：/xiaolin3303/wx-charts
（2）案例参考地址：/xiaolin3303/wx-charts/issues/58
感觉有帮助的话，给个赞吧！
