更改剪輯圖像？

createImage = (x=0, y=0) => { 
    imgC.save() 

    imgC.beginPath() 
    imgC.moveTo(side/2, center) 
    imgC.lineTo(side, 0) 
    imgC.lineTo(0, 0) 
    imgC.closePath(); 

    imgC.clip() 

    imgC.drawImage(image, x, y) 
    imgC.restore() 
}

我正在繪製一個像這樣的蒙面圖像。我想更新drawImage中的x/y座標而不更改其他任何內容。我怎樣才能做到這一點？更改剪輯圖像？

來源

2017-02-26 Himmators

我不明白。無論如何，'x'和'y'只能在'drawImage'中使用。改變這些變量有什麼問題？ –

我想將圖像位置映射到其他事件（如移動光標或傾斜手機等） – Himmators

@Himmators是正確的，修改X，Y參數不會影響其餘表達式。 – punkbit

我不確定你想要做什麼，因爲在我看來，你能夠改變傳遞的X，Y參數而不影響其餘表達式。

但是，有一些假設，這裏有一些未經測試的代碼，所以假設僞代碼來理解我分享的可能性。

createImage = (img, x=0, y=0) => { 
    img.save() 

    img.beginPath() 
    img.moveTo(side/2, center) 
    img.lineTo(side, 0) 
    img.lineTo(0, 0) 
    img.closePath(); 

    img.clip() 

    img.drawImage(image, x, y) 
    img.restore() 
    return img 
}

然後你可以使用這樣的：

var myImage = createImage(imgC, 100, 50)

3秒鐘後你更新X，Y

setTimeout(() => { 
    myImage.x = 150 
    myImage.y = 300 
}, 3000)

希望幫助！

來源

2017-02-26 23:47:12 punkbit

更改剪輯圖像？

回答

相關問題