vue项目中图片白色背景透明化处理

在项目开发中遇到处理图片背景的问题，需要将bmp格式的图片中的白色背景进行透明处理，同时转化为png的格式，做个笔记记录一下解决方法。

touMing(dataImg, callback) {
      let self = this;
      var base64Img = document.createElement("base64Img"),
        canvas = document.createElement("canvas"),
        context = canvas.getContext("2d");
      // 创建新图片
      var img = new Image();
      img.src = "data:image/bmp;base64," + dataImg;
      img.addEventListener(
        "load",
        function() {
          // 绘制图片到canvas上
          canvas.width = img.width;
          canvas.height = img.height;
          context.drawImage(img, 0, 0);

          // 将canvas的透明背景设置成白色
          var imageData = context.getImageData(
            0,
            0,
            canvas.width,
            canvas.height
          );
          for (var i = 0; i < imageData.data.length; i += 4) {
            //rgb大于250的透明度y均设置成0
            if (
              imageData.data[i] > 250 &&
              imageData.data[i + 1] > 250 &&
              imageData.data[i + 2] > 250
            ) {
              imageData.data[i + 3] = 0;
            }
          }
          context.putImageData(imageData, 0, 0);
          self.baseImg = canvas.toDataURL("image/png").slice(22);//返回base64
          if (typeof callback !== undefined) {
            if (callback) callback(self.baseImg);
          }
        },
        false
      );
    },