这篇文章主要为大家详细介绍了js HTML5 canvas绘制图片的方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
本文实例为大家分享了HTML5 canvas绘制图片的具体代码，供大家参考，具体内容如下
demo.js
window.onload=function() {
createcanvas();
drawImage();
}
function createcanvas() {
var CANVAS=document.getElementById('mycanvas');
context=CANVAS.getContext('2d');
}
function drawImage() {
var img=new Image();
img.onload=function() {
context.drawImage(img,0,0,200,200 );
}
img.src="img5.jpg";
}demo.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>canvas</title> <script type="text/javascript" src="demo.js"></script> </head> <body> <canvas id="mycanvas" width="400" hight="400" > <span>你的浏览器不支持canvas</span> </canvas> </body> </html>
图片：
效果：
相关推荐：
Atas ialah kandungan terperinci js HTML5 canvas绘制图片的方法. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Apakah kaedah penghasilan penghasilan animasi html5?
Perbezaan antara HTML dan HTML5
Di mana untuk menonton tayangan ulang Douyin secara langsung
Cara menggunakan tag div
kaedah yang dipanggil oleh penonton
Kod skrin biru 0x000009c
Purata jadual
Perbezaan antara telefon gantian rasmi dan telefon baharu
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
