HTML DOM drawImage() 方法
定義和用法
drawImage() 方法繪制一幅圖像。
語(yǔ)法
drawImage(image, x, y) drawImage(image, x, y, width, height) drawImage(image, sourceX, sourceY, sourceWidth, sourceHeight, destX, destY, destWidth, destHeight)
參數(shù)
參數(shù) | 描述 |
---|---|
image | 所要繪制的圖像。 這必須是表示 <img> 標(biāo)記或者屏幕外圖像的 Image 對(duì)象,或者是 Canvas 元素。 |
x, y | 要繪制的圖像的左上角的位置。 |
width, height | 圖像所應(yīng)該繪制的尺寸。指定這些參數(shù)使得圖像可以縮放。 |
sourceX, sourceY | 圖像將要被繪制的區(qū)域的左上角。這些整數(shù)參數(shù)用圖像像素來(lái)度量。 |
sourceWidth, sourceHeight | 圖像所要繪制區(qū)域的大小,用圖像像素表示。 |
destX, destY | 所要繪制的圖像區(qū)域的左上角的畫(huà)布坐標(biāo)。 |
destWidth, destHeight | 圖像區(qū)域所要繪制的畫(huà)布大小。 |
描述
drawImage() 方法有 3 個(gè)變形。第一個(gè)變形把整個(gè)圖像復(fù)制到畫(huà)布,將其放置到指定點(diǎn)的左上角,并且將每個(gè)圖像像素映射成畫(huà)布坐標(biāo)系統(tǒng)的一個(gè)單元。第二個(gè)變形也把整個(gè)圖像復(fù)制到畫(huà)布,但是允許您用畫(huà)布單位來(lái)指定想要的圖像的寬度和高度。第三個(gè)變形則是完全通用的,它允許您指定圖像的任何矩形區(qū)域并復(fù)制它,對(duì)畫(huà)布中的任何位置都可進(jìn)行任何的縮放。
傳遞給 drawImage() 方法的圖像必須是 Image 對(duì)象或 Canvas 元素。一個(gè) Image 對(duì)象能夠表示文檔中的一個(gè) <img> 標(biāo)記或者使用 Image() 構(gòu)造函數(shù)所創(chuàng)建的一個(gè)屏幕外圖像。