记录一个heatmap.js在strict模式下的bug

ImageData的data属性只读,无法修改
ImageData的data属性只读,无法修改
出问题的在原始代码的490行~528行

var img = this.shadowCtx.getImageData(x, y, width, height);
      var imgData = img.data;
      var len = imgData.length;
      var palette = this._palette;


      for (var i = 3; i < len; i+= 4) {
        var alpha = imgData[i];
        var offset = alpha * 4;


        if (!offset) {
          continue;
        }

        var finalAlpha;
        if (opacity > 0) {
          finalAlpha = opacity;
        } else {
          if (alpha < maxOpacity) {
            if (alpha < minOpacity) {
              finalAlpha = minOpacity;
            } else {
              finalAlpha = alpha;
            }
          } else {
            finalAlpha = maxOpacity;
          }
        }

        imgData[i-3] = palette[offset];
        imgData[i-2] = palette[offset + 1];
        imgData[i-1] = palette[offset + 2];
        imgData[i] = useGradientOpacity ? palette[offset + 3] : finalAlpha;

      }

      img.data = imgData; //这一行会在“use strict”后报错
      this.ctx.putImageData(img, x, y);

重点在于527行的img.data = imgData
由于ImageData对象的data属性是只读属性,因此在严格模式下会报错的
知道问题出在哪儿了,就可以修改了,
npm add heatmap.js后
node modules/heatmap.js/build里面,heatmap.js,heatmap.min.js两个都要改
正确的做法应该是
heatmap.js

//img.data = imgData; 
//改成
img = new ImageData(imgData, width, height);

heatmap.min.js

//k.data=l;
//改成
k=new ImageData(l,c,d);

或者去掉img.data = imgData;(k.data=l;)也可以,因为上面已经对imgData数组进行修改了。

改了之后
使用patch-package打个补丁,参考以下链接
https://blog.csdn.net/KOOK007/article/details/125724586

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值