2011年10月30日 星期日

HTML5_canvas_drawImage()_在canvas上繪製外部jpg點陣圖






< !DOCTYPE HTML>
< html>
< head>
< meta charset="utf-8">
< title>無標題文件< /title>
< style type="text/css">
#canvas1 {
 color: #000000;
 font-size: 100px;
 background-color: #000000;
 border: medium dotted #ffffff;
}
body {
 background-color: #000000;
}
< /style>< /head>

< body>

< canvas id="canvas1" width="550" height="400">< /canvas>
< script language="javascript">
//
var canvas = document.getElementById("canvas1");
var context = canvas.getContext("2d");
//
var image = new Image();
image.onload = function(){
 context.drawImage(image,0,0,canvas.width,canvas.height);
};
image.src = "nv007-001a.jpg";
< /script>

< /body>
< /html>

沒有留言: