<!DOCTYPE html> <!-- Author:苏一恒 Date:2019/11/3 19:35 Motto: The best time to plant trees is ten years ago, followed by now. 种树最好的时间是十年前，其次是现在。 --> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>将一个canvas绘制到另一个canvas上（通过离屏Canvas）</title> <style> body { background: #eeeeee; } #canvas { background: #ffffff; margin-top: 5px; margin-left: 10px; -webkit-box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.5); -moz-box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.5); box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.5); border: 1px solid rgba(0, 0, 0, 0.2); } </style> </head> <body> <canvas id='canvas'>canvas not supports</canvas> <script> 'use strict'; let canvas = document.getElementById('canvas'), context = canvas.getContext('2d'), 2019 offscreenContext = offscreenCanvas.getContext('2d'); //…… //设置离屏Canvas的尺寸匹配到屏内canvas offscreenCanvas.width = canvas.width; offscreenCanvas.height = canvas.height; //…… //绘制离屏context offscreenContext.drawImage(anImage,0,0); //…… //绘制新的离屏canvas尺寸到屏内canvas context.drawImage(offscreenCanvas,0,0,offscreenCanvas.width,offscreenCanvas.height); </script> </body> </html>
