V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
BruceLi
V2EX  ›  程序员

请教一下这种 3D 展示方式是怎么实现的?

  •  
  •   BruceLi · 2022-04-26 11:05:40 +08:00 · 3189 次点击
    这是一个创建于 702 天前的主题,其中的信息可能已经有所发展或是发生改变。

    效果从这里看到的 https://info.support.huawei.com/storage/3d-center/#/detail?productId=product_0723388318&model=dorado_18000v6_control_sas

    想请教一下这种效果用的什么建模工具和浏览器插件 /JS 库。

    19 条回复    2022-04-27 21:40:49 +08:00
    Dididadada
        1
    Dididadada  
       2022-04-26 11:09:11 +08:00
    3d 建模随便什么软件都可以,导出一个 gltf 或者 glb 文件,然后用 threejs 或者 babylonjs 这样的 webgl 引擎加载就好了,简单调一下渲染设置,都是现成 api ,五分钟搞定
    7075
        2
    7075  
       2022-04-26 11:56:11 +08:00
    h5 canvas.
    version0
        3
    version0  
       2022-04-26 12:08:39 +08:00
    前端展示不难,treejs 之类的工具库可以加载建模软件导出的格式,难得是建模吧,这工作量的 99%都花在建模上了吧,我看每个部件都做出来了,不仅仅是捏一个盒子加贴图
    hawei
        4
    hawei  
       2022-04-26 12:11:19 +08:00 via iPhone
    Three.js
    ilxv
        5
    ilxv  
       2022-04-26 12:19:17 +08:00
    很多 3D 模型网站就是这样可拖动预览的效果
    zhujoen
        6
    zhujoen  
       2022-04-26 12:19:26 +08:00
    KouShuiYu
        7
    KouShuiYu  
       2022-04-26 15:07:17 +08:00
    https://model-viewer.glitch.me/
    支持者 gltf 谷歌出的
    kangyan
        8
    kangyan  
       2022-04-26 15:09:32 +08:00
    这个精细度做的还是有水平的吧。。。楼上都这么强的吗
    Heanes
        9
    Heanes  
       2022-04-26 15:13:37 +08:00
    收藏一下
    pandaPapa
        10
    pandaPapa  
       2022-04-26 15:26:00 +08:00
    之前公司找人做过整个农村房屋的模型, 里面家具都有. 好像是 3000 一个
    rekulas
        11
    rekulas  
       2022-04-26 15:36:23 +08:00   ❤️ 1
    @kangyan 这只是最基础的展示,光技术上确实没什么难度,哪怕没 3d 经验照着教程也能 2 天撸一个出来,当然贴图需要美工提供下
    看看这个,才是高技术含量的
    https://summerandwinter.github.io/lab/webgl-water/index.html
    beginor
        12
    beginor  
       2022-04-26 18:27:33 +08:00
    @rekulas 这个对数学要求比较高,3d 这块写代码容易,但是数学是一大门槛, 足以劝退绝大多数人。
    BruceLi
        13
    BruceLi  
    OP
       2022-04-26 21:04:25 +08:00
    @Dididadada 感谢,我研究一下 three.js 。
    BruceLi
        14
    BruceLi  
    OP
       2022-04-26 21:05:58 +08:00
    @rekulas 这个要了解物理引擎才行吧,和我的需求相比明显超纲了。。。
    flyhelan
        15
    flyhelan  
       2022-04-26 22:57:33 +08:00
    @rekulas 有点吊,怎么做出来的?
    rekulas
        16
    rekulas  
       2022-04-26 23:26:01 +08:00
    @BruceLi
    @flyhelan
    正常人做确实是找个轮子比如 threejs 配合个物理 /粒子、光照引擎,不过这个的作者是个大神好像没用轮子自己手撸的,webgl+图形学+数学,对基础功要求太高,而且很多年前就写出来了,那时候 web 3d 才刚刚开始流行
    不过得益于现在的成熟生态让我们这些图形学小白也能写出类似作品来了
    flyhelan
        17
    flyhelan  
       2022-04-27 09:04:17 +08:00
    @rekulas 嗯。才发现人家是 13 年写的。
    beijiaoff
        18
    beijiaoff  
       2022-04-27 10:45:05 +08:00
    华为这个从产品展示角度来说挺不错的。
    BruceLi
        19
    BruceLi  
    OP
       2022-04-27 21:40:49 +08:00 via iPad
    @rekulas 能手撸出这个效果确实太牛了
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   3009 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 28ms · UTC 14:56 · PVG 22:56 · LAX 07:56 · JFK 10:56
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.