论坛 › Web密训营 › 技法49 (◐‿◑) 利用Two.js完成一个自循环图形

不二如是 发表于 2017-6-22 07:22:38

技法49 (◐‿◑) 利用Two.js完成一个自循环图形

本帖最后由 不二如是 于 2017-6-22 07:24 编辑

http://xxx.fishc.com/forum/201705/05/225545py2j222x5z6x55n2.png

按照提示，完成代码，秀秀你的编程能力！

不许看答案，否则打屁屁



程序分析：
        利用Two.js，完成下图所示图案组合；先绘制一个矩形和圆形，然后平移画布原点（从圆心0，0至旋转中心），最终利用on函数使其动起来。
        自行下载Two.js库，网站：https://two.js.org       

源代码：
**** Hidden Message *****




○面试题索引贴●
如果喜欢，请订阅{:10_303:} ：
HTML5 - 庖丁解牛 + JavaScript - 庖丁解牛

林子军 发表于 2017-10-6 16:10:00

4444

向一朵朵鲜花 发表于 2018-5-4 21:11:21

没用过这个板子

tang136 发表于 2018-5-18 23:24:28

利用Two.js完成一个自循环图形

Jemisun 发表于 2018-6-10 23:48:18

1

hxgoto 发表于 2018-6-12 08:51:15

嗯

dsa159245 发表于 2018-7-5 02:15:17

<script type="text/javascript">
                        var params = {width:400,height:400};//设置二维空间的宽高
                       
                        var two = new Two(params).appendTo(document.body);
                        circle = two.makeCircle(-72,0,50); //创建圆形
                        star = two.makeRectangle(75,0,75,75);//创建五角星
                       
                        var group = two.makeGroup(circle,star);
                        group.translation.set(two.width/2,two.height/2);
                        group.rotation = 0;
                       
                       
                       
                        two.update();//打印更新图形
                        two.bind('update',function(frameCount){
                                group.rotation += 0.03;
                        }).play();
                        //alert(two);
                </script>

a211827754 发表于 2018-9-25 12:29:38

em

小球鱼 发表于 2020-3-8 20:20:06

ha

查看完整版本: 技法49 (◐‿◑) 利用Two.js完成一个自循环图形