imageBitmapRendering-transferFromImageBitmap.html (1148B)
1 <!DOCTYPE html> 2 <link rel="match" href="imageBitmapRendering-transferFromImageBitmap-expected.html" /> 3 <body> 4 <p>Test whether the imageOrientation "from-image" works when creating an ImageBitmap from the ImageData of a canvas, and then transfered to an ImageBitmapRenderingContext.</p> 5 <canvas id="canvas" width="300" height="300"></canvas> 6 </body> 7 <script> 8 9 function drawSquares(ctx) { 10 ctx.fillStyle = 'red'; 11 ctx.fillRect(0,0,150,150); 12 ctx.fillStyle = 'green'; 13 ctx.fillRect(150,0,300,150); 14 ctx.fillStyle = 'blue'; 15 ctx.fillRect(0,150,150,300); 16 } 17 18 async function runTest() { 19 const canvas_temp = document.createElement('canvas'); 20 canvas_temp.width = 300; 21 canvas_temp.height = 300; 22 const ctx_temp = canvas_temp.getContext('2d'); 23 drawSquares(ctx_temp); 24 const imageSource = ctx_temp.getImageData(0, 0, 300, 300); 25 const imageOrientation = 'from-image'; 26 imageIDFlipped = await createImageBitmap(imageSource, 0, 0, 300, 300, { imageOrientation }); 27 const canvas = document.getElementById('canvas'); 28 const ctx = canvas.getContext('bitmaprenderer'); 29 ctx.transferFromImageBitmap(imageIDFlipped); 30 } 31 32 runTest(); 33 34 </script>