问题标签 [gltf]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
0 回答
1062 浏览

3d - Godot - 来自 GLB 导入的循环动画

在 Blender 中,我为 Godot 游戏中的简单机器人角色建模、纹理和动画制作了一个空闲动画。使用 KhronosGroup 的 Blender-gltf 导出器,我成功地将网格、材质和动画导出到一个 .glb 文件中,然后成功导入到 Godot 3.0.3。没有问题。

我选择了Autoplay on Load按钮,并通过选择相应的按钮来启用循环。然而,当我运行游戏时,动画确实在加载时播放,但它没有循环播放。对于 Collada 导入,只需按下循环按钮即可使其循环。.gltf/.glb 文件有什么不同导致循环选项不起作用吗?

我已经广泛搜索了 Godot、gltf-exporter 的文档以及几个谷歌搜索和教程,但似乎没有一个涵盖这个问题,因为大多数人使用 Collada (.dae) 文件。但出于其他原因,如果可能,我想使用 .glb 文件。我也想避免用代码强制循环属性,但如果这是唯一的可能性,那就是它的样子。

编辑:
我终于找到了一个set_loop(bool)设置动画是否循环的函数,允许使用这行代码成功设置循环:
$AnimationPlayer.get_animation("Animation_Name").set_loop(true)
但是,如果可能的话,我仍然希望在编辑器中设置它;它并不像需要在代码中设置的那种东西。

0 投票
0 回答
783 浏览

angular - Aframe raycaster 没有击中物体

我正在尝试将点击处理程序添加到 aframe 中的 3d 模型。模型中只有少数几个小区域会触发点击事件。有人可以帮我弄清楚为什么光线投射器大部分时间都没有击中物体吗?我在 aframe 场景中添加了我的 Angular2 模板片段。我正在使用 Aframe 版本 0.8.2。

任何帮助,将不胜感激!

更新:

我找到了问题的原因。查看带有光标鼠标光线来源的帧嵌入场景

滚动或移动场景容器似乎不会更新光线投射器。有人有解决方法吗?

0 投票
2 回答
2958 浏览

three.js - 为什么在导出为 GLTF 时,blender rigged 动画会变形?

我在 Blender 中创建了一个带有骨架绑定的动画。当我在 Blender 中按 Alt-A 对其进行测试时,它工作得非常好。但是,当我.glb使用 KhronosGroup GLTF 导出器将其导出为一个时,生成的动画会失真(例如,四肢断开连接并以一种奇怪的方式移动)。

为什么会发生这种情况(我该如何解决)?

在过去的两天里,我一直在尝试类似问题的解决方案(例如使用 Ctrl-A 应用位置/旋转/缩放,或删除网格上的骨架修改器),但没有一个对我有用。

链接:

这是动画应该是什么样子的屏幕记录的链接(这是我在 Blender 中播放的): https ://github.com/kylejlin/hosting-for-my-stackoverflow-questions/blob/master/正确的动画.mov

这是动画实际外观的屏幕录制链接(这是我.glb在浏览器中使用 Three.js 测试导出的内容): https ://github.com/kylejlin/hosting-for-my-stackoverflow-问题/blob/master/distorted-animation.mov

这是.blend文件: https ://github.com/kylejlin/hosting-for-my-stackoverflow-questions/blob/master/soldier.blend

这是导出的.glb文件: https ://github.com/kylejlin/hosting-for-my-stackoverflow-questions/blob/master/soldier.glb

0 投票
1 回答
967 浏览

javascript - 如何使用ie11在threejs中加载gltf场景

我做了一个简单的 html 来使用 three.js 和他们的 gltfloader.js 加载一个 gltf 模型,它在 Mozilla 上完美运行,但它没有出现在 ie11 上,即使它没有错误。我尝试过使用 es6-promise pollyfill,但它似乎不起作用。我需要它在 Internet Explorer 上工作。我将代码留在这里,它主要是示例代码的复制粘贴。

编辑:该框只是一个参考,表明只有 gltf 模型不起作用,该框在 ie11 上正常显示。

编辑 2:threejs 站点的gltf 加载器示例在 ie11 上也不起作用。这是否意味着loader不兼容ie11?

0 投票
1 回答
297 浏览

javascript - GLTF 索引计数与缓冲区大小错误相同

我正在努力学习 WebGL 并且玩得很开心!我决定使用 glTF 作为这个项目的 3d 格式。我让它运行良好,有一个奇怪的例外。当索引计数较低时(例如简单的三角立方体),索引计数等于索引缓冲区大小。这不可能。在我拥有的所有其他模型中,索引计数是缓冲区大小的 1/2。

这些会导致渲染错误,例如“错误:WebGL 警告:drawElements:索引缓冲区太小。”。下面是相关代码。

可渲染构造函数:

GLTF 到“可渲染”

这是渲染代码(它不是很漂亮,但为了完整起见,这里是):

有任何想法吗?

0 投票
1 回答
909 浏览

three.js - 如何保护我的 3d 模型文件(gltf)?

我用一个threejs写了一个游戏,用了很多gltf文件。我不想直接公开这些 gltf 文件。

0 投票
1 回答
10468 浏览

javascript - 如何将我的 FBX 文件压缩到 5MB 以下?

我有一个.fbx需要 58.8MB 的文件

使用此软件包将其转换为.glb使用 draco 压缩后:

https://github.com/facebookincubator/FBX2glTF/tree/master/npm

该文件现在需要 28.4MB

理想情况下,我需要得到低于 5MB 的文件。

我怎样才能做到这一点?

我正在使用 3DS Max。


角色曾经在加载时占据整个屏幕,现在这是我在转换为之后看到的内容.fbx.glTF将纹理的大小从2048x2048to减小1024x1024并将它们转换为.jpg

在此处输入图像描述

0 投票
1 回答
803 浏览

javascript - 将我的 FBX 文件转换为 .gltf 后,模型非常小,为什么?

问题:

将我的 FBX 文件转换为 .gltf 后,模型非常小,为什么?

我尝试使用缩放模型,frontObject.scale.set( 1000, 1000, 1000 );但出现以下错误:

此外,在

xhr.total 总是等于 0,而 xhr.loaded 等于一个大得离谱的数字。

我所做的只是将我的文件从 .fbx 转换为 .gltf 并将纹理的大小从 2048x2048 更改为 1024x1024。

这是我现在看到的屏幕截图:

在此处输入图像描述

以前,模型会占据整个垂直高度。


代码:


小提琴

https://jsfiddle.net/Username100/y54kpe1h/64 我能够以正确的大小加载模型!但似乎默认加载管理器错误地指示所有内容都已加载,这怎么可能?

0 投票
1 回答
2514 浏览

javascript - 使用 GLTFLoader 时出现 {"isTrusted":true} 错误

问题:

一切正常:我在 /GLTF/ 子文件夹中将我的 FBX 文件转换为 GLTF。

遗憾的是,一些转换后的文件中缺少一些几何图形,所以我尝试再次转换我的 FBX 文件,这次是 /TEST/。

突然,模型没有加载并且来自我的 console.log 语句:

我收到这个奇怪的无用错误:

所以我尝试将我的 FBX 文件转换为 .glb,这次转换为 /TEST2/ 并添加一个额外的 console.log 语句:

我仍然得到同样的错误:

加载第一个转换的 gltf 文件仍然有效(来自 /GLTF/ 的文件),但如前所述,有些似乎转换不正确:它们的一些几何形状丢失了。

这些错误是什么?如何让我的模型加载?


代码:


我用来从 FBX 转换为 GLTF 的 NPM 包:

https://www.npmjs.com/package/fbx2gltf


错误:

在此处输入图像描述


我看到了什么:

日志显示错误对象:{"isTrusted":true} 而不是实际的错误数据

.NET Cors isTrusted:Angular 5 应用程序的真正错误

core.umd.js 中的 {"isTrusted":true} 异常


编辑:

在此处输入图像描述

0 投票
1 回答
2155 浏览

javascript - 使用 js 从头开始​​创建 GLTF 文件

我有一些顶点和面数据只是简单的 x,y,z 坐标像这样:

是否可以仅从这些信息中创建一个 gltf 文件?