La toile dessine des images
Dessiner des images avec Canvas devrait être l'une de ses fonctionnalités ou points forts. Bien entendu, avec l’API File, JS devient inégalé. Ensuite, je vais vous montrer comment dessiner une image et créer un effet tridimensionnel.
Le code est le suivant :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)</title>
</head>
<body>
<p>Image to use:</p>
<img id="scream" src="http://img2.imgtn.bdimg.com/it/u=1901619824,975274476&fm=21&gp=0.jpg" alt="The Scream" width="220" height="277"><p>Canvas:</p>
<canvas id="myCanvas" width="250" height="300" style="border:1px solid #d3d3d3;">
您的瀏覽器不支持 HTML5 canvas 標(biāo)簽。</canvas>
<script>
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
var img=document.getElementById("scream");
img.onload = function() {
ctx.drawImage(img,10,10);
}
</script>
</body>
</html>
