WebGL3----点,线,面的学习(2)

      4、知识补充:右手坐标系

        

      可以观察上图,

              相同点: X轴正方向向右,Y轴正方向向上;

              不同点: 左手为向屏幕里,而右手为向屏幕外;

 

       5、线条的深入理解----绘制一个网格

        1)定义两个点

           在X轴上定义两个点P1(-500,0,0),P2(500,0,0)

         2)算法

           这两个点决定了X轴上一条线段,将这条线段复制20遍,分别平行移动到Z轴的不同位置,就能形成一组平行的线段;

           同理,将X轴上的这条线段先围绕Y轴旋转90度,然后在复制20份,平行于X轴移动到不同位置;代码如下:

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

                var line = new THREE.Line(geometry,new THREE.LineBasicMaterial({ color: 0x000000,opacity: 0.2}));

                line.position.z= (i*50)-500;

                scene.add(line);

                var line = new THREE.Line(geometry,new THREE.LineBasicMaterial({ color: 0x000000,opacity: 0.2}));

                line.rotation.y = 90*Math.PI/180; //旋转90度

                line.position.x = (i*50)-500;

                scene.add(line);

           }

    总结:

            对于立体的图像如果很难脑补,可以用笔画出来这样更加容易理解;

转载于:https://www.cnblogs.com/sunqq/p/10402533.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值