2d游戏中经常用到网格,点击的时候会有一个新的物体放上去很简单 网线是画直线 每个多宽画一条,同样画竖线也是这样,最关键的是确定鼠标在哪个方格中,也很简单鼠标位置处以方格的宽度,就得的整数就是横向的方格位置,竖向同理可得,附上源码
<!DOCTYPE>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="lib/canvas/canvas-1.2.dev.js">
</script>
<title>测试Canvas 方法</title>
</head>
<body style="padding:0 0 0 0; margin:0 0 0 0;">
<div style="width:100%;height:100%; padding:0 0 0 0; margin:0 0 0 0; font-size:50px;">
<canvas style="background-color:#ffffff; width:100%; height:100%; padding:0 0 0 0; margin:0 0 0 0;" id="ctMs">
</canvas>
</div>
<script type="text/javascript">