mirror of
https://github.com/servo/servo.git
synced 2025-08-14 01:45:33 +01:00
Auto merge of #20923 - jdm:canvas-source, r=avadacatavra
Respect the source rectangle when drawing a canvas to another canvas. This allows us to run the three.js examples without panicking, since they use self-drawing canvases to scroll the FPS graph. --- - [x] `./mach build -d` does not report any errors - [x] `./mach test-tidy` does not report any errors - [x] There are tests for these changes <!-- Reviewable:start --> --- This change is [<img src="https://reviewable.io/review_button.svg" height="34" align="absmiddle" alt="Reviewable"/>](https://reviewable.io/reviews/servo/servo/20923) <!-- Reviewable:end -->
This commit is contained in:
commit
40f7da0aac
4 changed files with 61 additions and 8 deletions
|
@ -0,0 +1,17 @@
|
|||
<link rel="match" href="drawimage_canvas_self_ref.html">
|
||||
<canvas id="dest" height="100" width="100"></canvas>
|
||||
<script>
|
||||
var canvasWidth = canvasHeight = 100;
|
||||
var destWidth = canvasWidth / 4;
|
||||
var destHeight = canvasHeight / 4;
|
||||
var destCanvas = document.getElementById('dest');
|
||||
var destCtx = destCanvas.getContext('2d');
|
||||
|
||||
destCtx.fillStyle = 'red';
|
||||
destCtx.fillRect(0, 0, canvasWidth, canvasHeight);
|
||||
destCtx.fillStyle = 'green';
|
||||
destCtx.fillRect(0, 0, canvasWidth / 2, canvasHeight / 2);
|
||||
destCtx.drawImage(destCanvas,
|
||||
0, 0, destWidth, destHeight,
|
||||
canvasWidth / 2, canvasHeight / 2, destWidth, destHeight);
|
||||
</script>
|
|
@ -0,0 +1,11 @@
|
|||
<canvas id="dest" height="100" width="100"></canvas>
|
||||
<script>
|
||||
var canvasWidth = canvasHeight = 100;
|
||||
var destCanvas = document.getElementById('dest');
|
||||
var destCtx = destCanvas.getContext('2d');
|
||||
destCtx.fillStyle = 'red';
|
||||
destCtx.fillRect(0, 0, canvasWidth, canvasHeight);
|
||||
destCtx.fillStyle = 'green';
|
||||
destCtx.fillRect(0, 0, canvasWidth / 2, canvasHeight / 2);
|
||||
destCtx.fillRect(canvasWidth / 2, canvasHeight / 2, canvasWidth / 4, canvasHeight / 4);
|
||||
</script>
|
Loading…
Add table
Add a link
Reference in a new issue