一般的网页游戏,都是用
关键代码:
function draw() {
var x=50,y=100;
var edge=25;
var draw_pos=[0,0, 0,1, 0,2, 1,2];
for(i=0;i< draw_pos.length/2;i++)
{
ctx.fillText("#", x+draw_pos[i*2] * edge, y+draw_pos[i*2+1]* edge);
}
}
draw();
效果:
关键代码:
function drawgame(draw_pos)
{
for(i=0;i< draw_pos.length/2;i++)
{
ctx.fillText("#", x+draw_pos[i*2] * edgex, y+draw_pos[i*2+1]* edge);
}
}
var draw_pos=[2,1, 2,2, 2,3, 2,4, 2,5, 4,1, 5,1, 6,1, 7,1, 8,1, 4,2, 8,2, 4,3, 5,3, 6,3, 7,3, 8,3, 8,4, 8,5, 7,5, 6,5, 5,5, 4,5, 10,1, 10,2, 10,2, 10,3, 10,4, 10,5, 11,5, 11,1, 12,1, 13,1, 14,1, 14,2, 14,3, 14,4, 14,5, 13,5, 12,5, 16,1, 17,1, 18,1, 19,1, 20,1, 20,2, 20,3, 20,4, 20,5];
drawgame(draw_pos);
draw_pos=[2,0, 2,1, 2,2, 2,3, 2,4, 4,0, 4,1, 4,2, 5,0, 6,0, 7,0, 8,0, 8,1, 8,2, 7,2, 6,2, 5,2, 8,3, 8,4, 7,4, 6,4, 5,4, 4,4, 10,0, 10,1, 10,2, 10,3, 10,4, 11,0, 12,0, 13,0, 14,0, 14,1, 14,2, 14,3, 14,4, 13,4, 12,4, 11,4, 16,0, 16,1, 16,2, 16,3, 16,4, 17,4, 18,4, 19,4, 20,4, 20,3, 20,2, 20,1, 20,0, 19,0, 18,0, 17,0, 17,2, 18,2, 19,2 ];
x=80,y=180;
drawgame(draw_pos);
x=0,y=350;
drawgame(draw_pos);
每个坐标,用编辑器制作。不可能是手动去数,去写。
3. 制作坐标序列的编辑器
坐标序列的输出:
编辑器截图:
编辑器使用JSP写的。每个位置,默认用减号表示。点击一个减号,添加一对坐标,用“#”表示。再次点击,删除该坐标。
点击clear,删除所有坐标。点击back,撤销上一次坐标。
编辑器做了修改,刷新gamejsa1.jsp,画面也会实时刷新。
关键技术:gamejsa1.jsp 从session获取数据,输出画面。
<% String data=(String)session.getAttribute("k1");
if(data == null)
data="";
//如果有数据,去掉最后一个逗号
//session中的数据:" 2,12, 2,11, 3,11, 4,11, 4,10,"
if(data.length()>1)
{
data=data.substring(0, data.length()-1);
}
%>
session取得的一个长字符串,去掉最后一个逗号,放到javascript中,成为一个整数数组。
draw_pos=[<%=data %>];
drawbg();
drawgame(draw_pos);
代码下载地址:
链接: https://pan.baidu.com/s/1DlRYpNqGcwbhLvflaq0wrg 提取码: 4wcf 复制这段内容后打开百度网盘手机App,操作更方便哦