| OLD | NEW |
|---|
| (Empty) | |
| 1 <!DOCTYPE html> |
| 2 <p>Below this text, there should be a checker pattern that is drawn pixelated, a
nd with low, medium and high filtering quality.</p> |
| 3 <canvas id="canvasOutput" width="250" height="50"></canvas> |
| 4 <script id='myWorker' type='text/worker'> |
| 5 self.onmessage = function(msg) { |
| 6 var osCanvas = new OffscreenCanvas(250, 50); |
| 7 var ctx = osCanvas.getContext('2d'); |
| 8 ctx.scale(10, 10) |
| 9 ctx.imageSmoothingEnabled = false; |
| 10 ctx.drawImage(msg.data, 0, 0); |
| 11 ctx.imageSmoothingEnabled = true; |
| 12 ctx.imageSmoothingQuality = 'low'; |
| 13 ctx.drawImage(msg.data, 6, 0); |
| 14 ctx.imageSmoothingQuality = 'medium'; |
| 15 ctx.drawImage(msg.data, 12, 0); |
| 16 ctx.imageSmoothingQuality = 'high'; |
| 17 ctx.drawImage(msg.data, 18, 0); |
| 18 var outImage = osCanvas.transferToImageBitmap(); |
| 19 self.postMessage(outImage, [outImage]); |
| 20 } |
| 21 </script> |
| 22 |
| 23 <script> |
| 24 if (window.testRunner) { |
| 25 testRunner.waitUntilDone(); |
| 26 } |
| 27 |
| 28 var checkerCanvas = document.createElement('canvas'); |
| 29 checkerCanvas.width = checkerCanvas.height = 5; |
| 30 var checkerContext = checkerCanvas.getContext('2d'); |
| 31 var checkerData = checkerContext.createImageData(5,5); |
| 32 for (pixel = 0; pixel < 25; pixel++) { |
| 33 var color = (pixel % 2) * 255; |
| 34 checkerData.data[pixel * 4 + 0] = color; |
| 35 checkerData.data[pixel * 4 + 1] = color; |
| 36 checkerData.data[pixel * 4 + 2] = color; |
| 37 checkerData.data[pixel * 4 + 3] = 255; |
| 38 } |
| 39 checkerContext.putImageData(checkerData, 0, 0); |
| 40 createImageBitmap(checkerCanvas).then(image => { |
| 41 var blob = new Blob([document.getElementById('myWorker').textContent]); |
| 42 var worker = new Worker(URL.createObjectURL(blob)); |
| 43 worker.addEventListener('message', msg => { |
| 44 var outputCtx = document.getElementById('canvasOutput').getContext('bitmap
renderer'); |
| 45 outputCtx.transferFromImageBitmap(msg.data); |
| 46 if (window.testRunner) { |
| 47 testRunner.notifyDone(); |
| 48 } |
| 49 }); |
| 50 worker.postMessage(image, [image]); |
| 51 }); |
| 52 </script> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 2181183003:
Expose imageSmothing attributes in OffscreenCanvas 2D context (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master