我想把七巧板分解來畫，先畫出第一個板塊，不知道是否語法有問題？能這樣直接使用多層數組的值嗎？ tangram.p.x[0]
$("#tangram").bind("click",function tangram() {
? ?var canvas = document.getElementById("canvas");
? ? canvas.width = 800;
? ? canvas.height = 700;
? ?if (canvas.getContext("2d")) {
? ? ? ?var context = canvas.getContext("2d");
? ?}
? ?else {
? ? ? ?alert("當前瀏覽器不支持Canvas,推薦使用Chrome瀏覽器")
? ?}
? ?var tangram=[
? ? ? ?{p:[{x:0,y:0},{x:800,y:0},{x:400,y:400}],color:"red"},
? ? ? ?{},
? ? ? ?{},
? ? ? ?{},
? ? ? ?{},
? ? ? ?{},
? ? ? ?{},
? ?]
? ?context.beginPath();
? ?context.moveTo(tangram.p.x[0],tangram.p.y[0]);
? ?context.lineTo(tangram.p.x[1],tangram.p.y[1]);
? ?context.lineTo(tangram.p.x[2],tangram.p.y[2]);
? ?context.closePath();
? ?context.fillStyle="tangram.p.color";
? ?context.fill();
? ?context.strokeStyle="red";
? ?context.stroke();
})
2015-01-23
自己解決了，問題出在數組的語法錯誤，經過幾次修改，終于把第一個三角形畫出來了，不過貌似比老師的例子里面大很多啊
$("#tangram").bind("click",function tangram() {
? ?var canvas = document.getElementById("canvas");
? ? canvas.width = 800;
? ? canvas.height = 700;
? ?if (canvas.getContext("2d")) {
? ? ? ?var context = canvas.getContext("2d");
? ?}
? ?else {
? ? ? ?alert("當前瀏覽器不支持Canvas,推薦使用Chrome瀏覽器")
? ?}
? ?var tangram=[
? ? ? ?{p:[{x:0,y:0},{x:800,y:0},{x:400,y:400}],color:"red"},
? ? ? ?{},
? ? ? ?{},
? ? ? ?{},
? ? ? ?{},
? ? ? ?{},
? ? ? ?{},
? ?]
? ? ? ?context.beginPath();
? ? ? ?context.moveTo(tangram[0].p[0].x,tangram[0].p[0].y);
? ? ? ?context.lineTo(tangram[0].p[1].x,tangram[0].p[1].y);
? ? ? ?context.lineTo(tangram[0].p[2].x,tangram[0].p[2].y);
? ? ? ?context.closePath();
? ? ? ?context.fillStyle=tangram[0].color;
? ? ? ?context.fill();
})