微信小程序 - 曲线图_微信小程序 曲线ui

最近要做微信小程序，项目中需要曲线图显示数据，所以在网上看了一下找了很久都没有找到一个，不知道是我查找的姿势不对，还是什么的。所以就自己做了一个曲线图，现在分享给大家。

不啰嗦，直接上代码：

wxml代码:

<canvas canvas-id='curve-img' style='width:{
  {canvasWidth}}px;height:{
  {canvasHeight}}px;'></canvas>
1
2
3

js代码：

// pages/canvas/index.js
Page({
canvasIdErrorCallback: function(e) {
 console.error(e);
},
/**
* 页面的初始数据
*/
data: {
 canvasWidth: 0,
 canvasHeight: 300,
 canvasDefaultVal: {
   maxVal: 0,
   totalData: 0,
   data: []
 }
},

/**
* 生命周期函数--监听页面加载
*/
onLoad: function(e) {
 var _this = this;
 wx.getSystemInfo({
   succe
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24