PDF在线预览-手势缩放

Vue项目中碰到带电子印章的pdf在线预览需要带手势缩放，在这里分享一下，仅供参考。

用的是pdf.js这个强大插件，直接上关键代码。

// html
<template>
	<div>
		<canvas v-for="page in pages" 
			@touchstart="touchstart" 
			@touchmove="touchmove" 
			@touchend="touchend">
		</canvas>
		<div class="loading-content" v-show="showLoading">
              <i class="loading-icon"></i>
              <p class="loading-text">加载中</p>
          </div>
	</div>
</template>

// 
<script>
//PDFJS这样引入的原因是项目上 个性化了一下pdf.js插件，一般的可以直接npm 集成到全局或者项目工程上
import PDFJS from "../../../static/pdfjs-dist/build/pdf.js";
const Base64 = require("js-base64").Base64;
export default {
   
  name: "pdf",
  data() {
   
    return {
   
      title: "PDF浏览",
      pdfDoc: null,
      pages: 0,
      touchDistance:0,
      previousPinchScale: 1,
      startTime: 0,
      startX:null,
      startY:null,
      moveX:null,
      moveY:null,
      eLen:0,
      showLoading: false
    };
  },
  methods: {
   
    _getDistance(xLen,yLen) {
   
      return Math.sqrt(xLen * xLen + yLen * yLen);
    },
    touchstart(e){
   
      this.startTime = this._getTime();
      this.startX = e.touches[0].pageX;
      this.startY = e.touches[0].pageY;
      if(e