【verge3d】如何在项目里调用接口

一、什么是verge3d

首先,这个是要钱的

不过可以免费试用一个月,使用期间可以充分的学习官方提供模板项目,但是上传服务是亚马逊那边的,就是得自己那啥一下。

为什么选它

公司接到几个小型的web3d的项目,所以我直接在找合适的平台。团队里有专门负责用blender建模的美术成员,然后verge3d又和blender接入的非常流畅,因此没有选playcanvas这种比较重的方案(几乎就是网页版的unity、ue了,不过我调研的时候对这个更有兴趣,后面有机会研究研究再写一篇文章)

里面有什么

我现在的使用呢,是下了一个verge3d for blender,可以在blender里起服务,也可以开始菜单里直接找这个名字的应用启动,它会运行在locahost:8668这个端口。它里面呢,照我的了解是优化出了一套verge3d自己的gltf方案,web特供,具体的优化细节本文不过多阐述(也超我纲了!)。它自己有一套"拼图"系统,并不太像ue里的蓝图,它拼图长得很像少儿编程的哪个scratch,事后我得知它们外观像仅仅因为都使用了Google 的Blockly 开源框架

Factory Tour项目模板为例我所知道的

blender的【空物体>纯轴】,用处的比较广泛(官方b站的瑞士军刀项目有讲过09.标注 - Verge3D for Blender入门教程_哔哩哔哩_bilibili)。infographics这个blender集合里的纯轴,带"_sign"后缀的是给拼图生成标注用的,带"__maker"后缀的是给标注的生成线条的终点用的。

(这部分后面我调研完会再来补充,就是用ue过来人的角度,看它这边怎么整漫游的)

二开

官方有verge3d的npm包,提供了react和vue的模板项目,不过代价是用不了拼图咯(据我了解)。我还没想好这条产品线要不要用verge3d去做深,所以还未进一步调研。(官方搭的react架子是react18+webpack的,没有上vite)。

手写一点小功能的话,倒是不用react模板项目。下图为例:在项目同名的.js里,有个runcode的入口,是暴露给开发自己写点东西的,可以用advanced的拼图call external function 去调用自定义方法。而visual_logic.js这个文件,是拼图编译后生成的可读js------别想着改这个去回写拼图了,首先是不行,然后是拼图每次save更新都会重新生成新的visual_logic.js。

我用腾讯的云函数简单写了个get接口用来测一下

截图里,我展示了两个调get接口的法子(自定义拼图方法在Procedures里面)

其一:

自定义拼图方法handleMyJSFunction,里面调用了我自定义js方法myJSFunction,然后需要在拼图里异步promise包一下。

其二:

自定义拼图方法handleTestApi。接口那边如果http状态码200的话,只靠拼图的on error do拿不到啥有用的返回

部署

nginx就能搞,整个项目放上去,然后index参数改成factory_tour.html, 然后类型支持加上个webp

复制代码
    location ~ .*\.(gif|jpg|jpeg|png|bmp|swf|webp)$
    {
        expires      30d;
        error_log /dev/null;
        access_log /dev/null;
    }
相关推荐
陶甜也14 小时前
threeJS 实现开花的效果
前端·vue·blender·threejs
默子昂4 天前
MMD动画(二)动作制作
blender
CG_MAGIC5 天前
用Blender制作Rat Rod风格汽车
blender·建模教程·汽车建模·渲云·数字创作·rat rot
精致的螺旋线5 天前
【Blender】二次元人物制作【一】:二次元角色头部建模
blender
CG_MAGIC5 天前
Blender 重拓扑修改器实战指南:从基础操作到细节优化
blender·重拓扑
dxwd3207 天前
试用Augment编写python脚本实现智能家居3D环境交互响应
人工智能·3d·智能家居·blender
精致的螺旋线7 天前
Blender建模:对于模型布线的一些思考
blender
雪下的新火7 天前
多软件共修:模型重拓扑&模型减面
经验分享·blender·3dmax·maya·三维建模·重拓扑·c4d
AndrewHZ10 天前
【三维渲染技术讨论】Blender输出的三维文件里的透明贴图在Isaac Sim里会丢失, 是什么原因?
算法·3d·blender·nvidia·贴图·具身智能·isaac sim
枫叶200011 天前
Blender建模软件基本操作--学习笔记1
笔记·学习·blender