Closed gdx1231 closed 2 years ago
实例的hasCanUseLine
方法可以判断是否有内容,增加通过颜色数量进行判断的原因是什么呢?
当用户的签名保存为图片A,再次打开页面,图片A作为签名的背景图,当用户没有任何操作时,不会有线条记录。因此当再次提交数据时,会错误判断签名无内容。
怎么根据getImageColors
函数返回map
去判断是否有内容呢?
当画布上什么都没有的时候map
的值为:{00000000: 596500}
,当有内容时map
里有很多内容
已增加hasContent
方法用于判断是否有内容
:)
`
tablet.getImageData = function() { | let data = this.ctx.getImageData(0, 0, this.canvas.width, this.canvas.height); | return data.data; | }; tablet.getImageColors = function() { | // 获取像素数据 | let data = this.getImageData(); | function toHex(a){ | let hex = a.toString(16); | if(hex.length == 1){ | return "0"+hex; | } else { | return hex; | } | }; | function toColor(r,g,b,a){ | let s = []; | s.push(toHex(r)); | s.push(toHex(g)); | s.push(toHex(b)); | s.push(toHex(a)); | return s.join(''); | } | let map={}; | for (let i = 0; i < data.length; i += 4) { | let r = data[i]; | let g = data[i+1]; | let b = data[i+2]; | let a = data[i+3]; | let c = toColor(r,g,b,a); | if(map[c]){ | map[c]++; | } else { | map[c]=1; | } | } | return map; | };
`