`

html5 canvas - first try

HTML5ASPHTML 
阅读更多
html5 canvas 标签，提供了画图功能；

可参考：http://www.w3schools.com/html5/tag_canvas.asp

简单例子： 
<!DOCTYPE HTML>
<html>
	<head>
		<meta charset="utf-8" />
		<title>html 5 test</title>
		<script type="text/javascript">
			function init() {
				var canvas = document.getElementById("canvas");
				if (canvas.getContext) {
				  var ctx = canvas.getContext("2d");
				
				  ctx.fillStyle = "rgb(200,0,0)";
				  ctx.fillRect (10, 10, 55, 50);
				
				  ctx.fillStyle = "rgba(0, 0, 200, 0.5)";
				  ctx.fillRect (30, 30, 55, 50);
				}
			}
		</script>
	</head>
	<body onload="init();">
		<canvas id="canvas"></canvas>
	</body>
</html>
分享到：
| html 5 in w3c
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    html2canvas

    The first set is a number of qunit tests that check that different values parsed by browsers are correctly converted in html2canvas. To run these tests with grunt you'll need phantomjs. The other ...

    javacv-platform-1.3.3-src

    // CanvasFrame is a JFrame containing a Canvas component, which is hardware accelerated. // It can also switch into full-screen mode when called with a screenNumber. // We should also specify the ...

    Delphi代码生成二维码

    try // 设置编码参数，如纠错级别、版本等 QRWriter.setECLevel(TECLevel.L); // 数据编码 BitMatrix := QRWriter.encode('你的数据', TBarcodeFormat.QR_CODE, 200, 200); // 转换为图像 BarcodeImage :...

    cxGrid用法汇总

    ACtrlData.First; for i := 0 to ACtrlData.RecordCount - 1 do begin if ACtrlData.FieldByName('SQBF_DisplayInGrid').AsString = '1' then // 是否显示 with TbView.CreateColumn do begin DataBinding....

    Java 2实用教程（第三版）实验指导与习题解答

    实验3 联合编译 5 上机实践2 基本数据类型与控制语句 6 实验1 输出希腊字母表 6 实验2 回文数 6 实验3 猜数字游戏 8 上机实践3 类与对象 9 实验1 三角形、梯形和圆形的类封装 9 实验2 实例成员与类成员 12 实验3 ...

    odoo themes

    ### Odoo Themes: A Comprehensive ... Whether you are a seasoned web designer or just starting out, Odoo provides the perfect canvas to bring your ideas to life. Start exploring the possibilities today!

    ViewPager 放大缩小左右移动

    * through its first layout there will be a smooth animated transition * between the current item and the specified item. * * @param item * Item index to select */ public void ...

    自己用java制作贪吃蛇小游戏

    Node n = (Node)nodeArray.getFirst(); int x = n.x; int y = n.y; switch(direction){ case UP: y--; break; case DOWN: y++; break; case LEFT: x--; break; case RIGHT: x++; break; } if (...

Magicbox
Global site tag (gtag.js) - Google Analytics