【ResDevKit】Web3d 模板

Web3D 模板

浏览器支持

PC:Chrome或者Chromium内核 40版本以上,暂不支持ie

Mobile:微信,企业微信,QQ,Chrome或者Chromium内核浏览器

模型要求

  1. 统一坐标系:右手坐标系,Y轴向上

    3dsmax:导出模型时,需要在原坐标系的基础上,调整Y轴向上,调整方法:https://blog.csdn.net/wlj613613/article/details/17797795

  2. 统一基本长度单位:导出模型时,设置基本长度单位为 cm

  3. 统一导出的模型格式:fbx

  4. 注意原点位置:如无特殊要求,一般以模型中心点为原点;

  5. 模型尽量小点,最好10M以内;

  6. 结构展示的部件名称 带mPart_前缀;

备注: 如有特殊情况,都按特殊情况的需求来设定。

Web3D 模板

结构展示 模板

web3d-jgzs-001

效果外链:http://bmw.jingge.com/presale/jgzs3d/

image-20210625084504906

config.json 配置表

root
image-20210624153840099
参数 说明 类型 默认值 备注
isAidSystemEnabled 是否开启辅助系统, true 开启 false 关闭 boolean false
scene 3d场景 相关配置 object
title 标题栏 相关配置 object
menu 右侧菜单窗口 相关配置 object
desc 左侧详细说明窗口 相关配置 object
label 模型标注 相关配置 object
tree 菜单树 相关配置 object
scene
image-20210624162530086
参数 说明 类型 默认值 备注
angleLimit 场景缩放远近等角度限制,分别是 水平旋转上限,水平旋转下限,垂直旋转上限,垂直旋转下限,最大向外移动焦距,最大向内移动焦距
一般保持默认,最多修改最后2个的值;
object
camera 场景初始化时,相机的初始角度;
默认是模型居中,相机对着模型的正视图视角
如果想定制角度,就在制作模型时就添加一个相机,设置好position和target;然后这边程序会获取这个相机的参数,进行设置;
modelName 是这个相机所在模型的名字,
name 这个相机的名字
targetName相机的target的名字
object
background 3d场景的背景,目前只能是图片
预加载页的背景图和这里保持一致
string
model 场景里的结构展示的模型
path 模型的文件夹路径
url 模型的路径
position 模型的坐标,目前保留字段,忽视它
rotation 模型的旋转度,目前保留字段,忽视它
scale 模型的缩放度,可以使用
map 模型的贴图
path 贴图的文件夹路径
maps 模型用到的所有贴图
map 颜色贴图
aoMap 该纹理的红色通道用作环境遮挡贴图
normalMap 用于创建法线贴图的纹理
roughnessMap 该纹理的绿色通道用于改变材质的粗糙度
metalnessMap 该纹理的蓝色通道用于改变材质的金属度
emissiveMap 放射(发光)贴图
alphaMap 透明度贴图
object
titile
image-20210624174728884
参数 说明 类型 默认值 备注
text 标题内容 string
font 文本字体 属性
family 字体类型
color 字体颜色
size 字体大小
object
background 标题栏 背景
可以使用颜色值,图片都可以,使用文档参考
string
image-20210624175358625
参数 说明 类型 默认值 备注
font 文本字体 属性
family 字体类型
color 字体颜色
size 字体大小
object
line 中间分割线
color 颜色值,如果想隐藏这根线,就用rgba颜色值 "rgba(0, 0, 0, 0.00)"
object
background 标题栏 背景
可以使用颜色值,图片都可以,使用文档参考
string
desc
image-20210624175839611

参数使用和 menu 的一模一样

label
image-20210624180127784
参数 说明 类型 默认值 备注
font 文本字体 属性
family 字体类型
color 字体颜色
size 字体大小
object
backgroundColor 标注 文本的背景色 string
model 3d标注模型
path 模型的文件夹路径
url 模型的路径
position 模型的坐标,目前保留字段,忽视它
rotation 模型的旋转度,目前保留字段,忽视它
scale 模型的缩放度,目前标注模型的缩放是跟随 结构模型的部件的,先忽视它
map 模型的贴图
path 贴图的文件夹路径
maps 模型用到的所有贴图
map 颜色贴图
aoMap 该纹理的红色通道用作环境遮挡贴图
normalMap 用于创建法线贴图的纹理
roughnessMap 该纹理的绿色通道用于改变材质的粗糙度
metalnessMap 该纹理的蓝色通道用于改变材质的金属度
emissiveMap 放射(发光)贴图
alphaMap 透明度贴图
object
tree
image-20210624180559000
参数 说明 类型 默认值 备注
key 唯一id,和 scene里的结构模型里 部件的name一样,要保持唯一,不能重复
image-20210624181725804
string
title 菜单列表显示的文本信息 string
label 每个部件mesh对应的标注的一些属性
position 当前部件mesh的标注的局部坐标
lineScale 标注线的缩放;y 为0时,不显示标注线,只显示文本;y为1时,标注线是1倍长度缩放;
object
children 子对象,如果当前部件有子部件,则在这里填 array

Donate
  • 版权声明: 本博客所有文章除特别声明外,著作权归作者所有。转载请注明出处!
  • Copyrights © 2015-2022 Peng Xiang
  • 访问人数: | 浏览次数:

请我喝杯咖啡吧~

支付宝
微信