美文网首页
threejs模型三视图操作

threejs模型三视图操作

作者: 知行合一实践派 | 来源:发表于2021-03-18 20:09 被阅读0次

    导语:

                前面分享了几个有关threejs的实操案例,发现自己是真不太表达。不过还好我把步骤代码是直接贴出来的,可以方便大家拷贝。关于threejs的demo案例其官方提供的demo有很多,不过我们真正在项目中需要使用的功能或者效果,demo案例经常会遇到没有提到的,这就需要靠大家一起研究分享。下面我再和大家分享一个比较常见而且实用的功能--三视图,一般设备查看都会实用该功能,效果如下图:

    怎么样 是不是很炫酷。

    1. 代码分享

    前期准备工作就不介绍了,这里直接开始视图切换,在三维场景里 相机分为正交相机和透视相机,大家在做项目的时候估计大部分都是使用的正交相机,因为这个相机更符合人们的视角观察(通俗点就是近大远小),正交相机一般都用在机械或工程制图里(我这里说的是一般具体什么场景用什么相机 我觉得都是用户说的算毕竟人家是出资方^^);唠叨了半天还没写代码,因为三视图这两种相机的选择会有一点点区别。这个时候再不贴代码就真讲不清楚了,这里我只以顶视图为例说明:

    threeInit.camLength=10;// 透视相机该值大小不重要,只是表面我们使用的方向,正交相机该值是相机到物体的距离,相当重要,threeInit这个大家可以忽略,是我定义的一个存储变量的对象;

    threeInit.camera.position.set( 0,threeInit.camLength,0);// 顶视图 x、z值为0;y值就是我们设置好的,自己添加对应事件就行了;其它两个视图一样

    结语:本次案例没有太多代码,也没有难度(难度都是会者不难,我也是测试了很多次才发现的 哎 一步步实践出真知)希望可以帮助到大家 

    相关文章

      网友评论

          本文标题:threejs模型三视图操作

          本文链接:https://www.haomeiwen.com/subject/jkypcltx.html