当用户点击掩模图像&上传图片并尝试拖动图片,图片会显示闪烁/闪烁,但我不想显示Flash ….
这是视频链接
codepen:https:// …
库中有一行你必须将它注释掉。
context.clearRect(0,0,canvas.width,canvas.height); //它用于清除绘图而不是重绘它。
用我在下面给你的方法替换你的方法它会起作用。
container.updateStyle = function() { clearTimeout(timeout); timeout = setTimeout(function() { // context.clearRect(0, 0, canvas.width, canvas.height); context.beginPath(); context.globalCompositeOperation = "source-over"; image = new Image(); image.setAttribute('crossOrigin', 'anonymous'); image.src = settings.maskImageUrl; image.onload = function() { canvas.width = image.width; canvas.height = image.height; context.drawImage(image, 0, 0, image.width, image.height); div.css({ "width": image.width, "height": image.height }); }; img = new Image(); img.src = settings.imageUrl; img.setAttribute('crossOrigin', 'anonymous'); img.onload = function() { settings.x = settings.x == 0 && initImage ? (canvas.width - (img.width * settings.scale)) / 2 : settings.x; settings.y = settings.y == 0 && initImage ? (canvas.height - (img.height * settings.scale)) / 2 : settings.y; context.globalCompositeOperation = 'source-atop'; context.drawImage(img, settings.x, settings.y, img.width * settings.scale, img.height * settings.scale); initImage = false; }; }, 0); };