vue组件

实现vue心电图组件

由于公司需求需要在h5页面实现心电图报告，没办法咯 只能自己使用canvas简单画一个，潦草记录一下
本文使用vue-cli创建项目

创建canvas节点

首先咱们需要一个canvas

	<canvas id="ecg1">浏览器暂不支持h5的canvas元素</canvas>

画心电网图

废话不多说直接上代码
1. 创建初始化方法initGrid
2. 创建小中大三个网格方法 drawSmallGrid，drawMediumGrid， drawBigGrid
3. 根据数据画曲线图: 

initGrid () {
   
	// 获取canvas对象
    this.c_canvas = this.$refs[this.$props.cid]
    this.context = this.c_canvas.getContext('2d')
    // 获取c_canvas宽度，高度由组件自由传递
    this.w = this.c_canvas.width = this.c_canvas.clientWidth
    this.h = this.c_canvas.height = this.$props.height
    // 编辑网格
    this.drawSmallGrid()
    this.drawMediumGrid()
    this.drawBigGrid(