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

请教canvas生成的星空 如何获取所有图形做放大动画?

/ 猿问

请教canvas生成的星空 如何获取所有图形做放大动画?

https://img2.mukewang.com/5c331caa00012c1208000400.jpg

<!DOCTYPE html>

<html>

<head>

    <title>星空</title>

    <script type="text/javascript">

        function draw() {

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

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

            context.fillStyle="black";

            context.fillRect(0,0,canvas.width,canvas.height);

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

            var r=Math.random()*10+10;

            var x=Math.random()*canvas.width;

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

            var a=Math.random()*360;

            drawStar(context,x,y,r,r/2.3,a)

            }

        }

 

            function drawStar(cxt,x,y,r,R,rot) {

            cxt.beginPath();

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

                cxt.lineTo(Math.cos((18+i*72-rot)/180*Math.PI)*R+x,-


Math.sin((18+i*72-rot)/180*Math.PI)*R+y);

                cxt.lineTo(Math.cos((54+i*72-rot)/180*Math.PI)*r+x,-


Math.sin((54+i*72-rot)/180*Math.PI)*r+y);

            }

            cxt.fillStyle="yellow"

            cxt.closePath();

            cxt.fill();

        }

    </script>


    <style type="text/css">


    </style>

</head>

<body onload="draw()";>

<canvas id="canvas" width="800" height="400">

</canvas>

</body>

</html>



查看完整描述

目前暂无任何回答

添加回答

回复

举报

0/150
提交
取消
意见反馈 邀请有奖 帮助中心 APP下载
官方微信