微信小程序制作图表

微信小程序制作图标可用echarts框架
以下是使用的例子：

wxml文件

wxss文件

ec-canvas {
  width: 100%;
  height: 100%;
}

json文件

 "usingComponents": {
    "ec-canvas": "../../ec-canvas/ec-canvas"
  }

js文件

import * as echarts from '../../ec-canvas/echarts';

const app = getApp();

function initChart(canvas, width, height, dpr) {
  const chart = echarts.init(canvas, null, {
    width: width,
    height: height,
    devicePixelRatio: dpr // new
  });
  canvas.setChart(chart);

  var option = {
    title: {
      text: '体温数据',
      left: 'center',
      top: '10px'
    },
    color: ["#4e5fe4"],
    grid: {
      containLabel: true,
      left: '6%'
    },
    tooltip: {
      show: true,
      trigger: 'axis'
    },
    xAxis: {
      type: 'category',
      boundaryGap: false,
      data: ['6/19','6/20','6/21','6/22', '6/23', '6/24', '6/25', '6/26', '6/27', '6/28','6/29', '6/30','7/1','7/2'],
      // show: false
      axisLabel:{interval:0}
    },
    yAxis: {
      x: 'center',
      type: 'value',
      splitLine: {
        lineStyle: {
          type: 'dashed'
        }
      },
      min:'35',
      max:'37',
      splitNumber:10
      // show: false
    },
    series: [{
      name: '℃ ',
      type: 'line',
      smooth: true,
      data: [36.2, 36.6, 35.8, 36.1, 35.2, 36.8, 36.5, 36.0, 36.8, 36.5,36.1,35.9,35.7,35.4]
    }],
    dataZoom: [
      { //Y轴固定,让内容滚动
             type: 'slider',
             show: false,
             xAxisIndex: [0],
             zoomLock: false, //锁定区域禁止缩放(鼠标滚动会缩放,所以禁止)
             startValue: 8,
             endValue: 14,
         },
         {
             type: 'inside',
             xAxisIndex: [0],
             start: 1,
             end: 80,
             zoomLock: false, //锁定区域禁止缩放
         },
        ]
  };

  chart.setOption(option);
  return chart;
}
Page({
  /**
   * 页面的初始数据
   */
  data: {
    ec: {
      onInit: initChart
    }
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {

  },

其中的框架包可去Echarts官网https://echarts.apache.org/zh/index.html下载,因为小程序有代码包大小要求,建议引用需要用到的文件即可,如本项目只引用了ec-canvas