为了账号安全,请及时绑定邮箱和手机立即绑定

为什么我只画出来三个点呢。。

http://img1.sycdn.imooc.com//563b63d3000167e205150438.jpg

window.onload = function() {

var canvas = document.getElementById("canvas");

// canvas.height = window.innerHeight;

// canvas.width = window.innerWidth;

canvas.height = 800;

canvas.width = 800;

if(canvas.getContext("2d")) {

var context = canvas.getContext("2d");

} else {

alert("当前浏览器不支持canvas,请更换浏览器后再试");

}


// drawRect(context,0,0,canvas.width,canvas.height,0,"black","black")


// context.save();

context.strokeStyle = "green";

context.fillStyle = "red";

context.translate(100,100);

drawStar(context);

context.translate(100,100);

drawStar(context);

context.translate(100,100);

drawStar(context);

// context.restore();


// context.lineWidth = 5;

// context.strokeStyle = "#fd5";

// context.fillStyle = "#fb3";

// for(var i=0;i<200;i++) {

// var x = Math.random()*(canvas.width);//*Math.pow(-1,Math.ceil(Math.random()*1000))   正负1

// var y = Math.random()*(canvas.height);

// var rot = Math.random()*360;

// context.save();

// context.translate(x,y);

// context.rotate(rot);

// drawStar(context);

// context.restore();

// }

}


function starPath(cxt) {

cxt.beginPath();

for(var i=0;i<5;i++) {

cxt.lineTo(Math.cos((18+72*i)/180*Math.PI),Math.sin((18+72*i)/180*Math.PI));

cxt.lineTo(Math.cos((54+72*i)/180*Math.PI)*0.5,Math.sin((54+72*i)/180*Math.PI)*0.5);

}

cxt.closePath();

}


function drawStar(cxt) {

starPath(cxt);

cxt.fill();

cxt.stroke();

}


function drawRect(cxt,x,y,width,height,borderWidth,borderColor,fillColor) {

cxt.lineWidth = borderWidth;

cxt.strokeStyle = borderColor;

cxt.fillStyle = fillColor;

cxt.fillRect(x,y,width,height);

cxt.strokeRect(x,y,width,height);

}


正在回答

1 回答

是因为基本的星星半径太小了,设大点就会出现星星的形状了

0 回复 有任何疑惑可以回复我~
#1

霞_霞

或者在绘制路径前,通过设置context.scale(3,3);放大
2015-12-15 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

为什么我只画出来三个点呢。。

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信