关于 ThreeJS加载FBX 在iphone加载后 看不见 丢失 的问题

最新推荐文章于 2024-07-10 14:42:15 发布
最新推荐文章于 2024-07-10 14:42:15 发布
阅读量2.2k 收藏 1
点赞数
分类专栏： JavaScript ThreeJs
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ljason1993/article/details/90764931
版权

首先 android手机 打开是木有问题的 而且和threejs的版本也没有关系

问题是 iphone 无论是微信浏览器 Safari 还是chrome 加载模型成功 scene.add 的一瞬间模型就消失了

你需要看看pc上面console里面是不是有报像素有问题(下图)

这就证明你的贴图不是2的指数(好吧这个词我也理解不过来,反正就是2的多少次方的数)

这样苹果就无法显示了(什么鬼....)

让你的模型师把贴图改一下就好了呢....或者你直接吧贴图文件删除,看看是不是有个黑模,就知道了~~~

坑了我2小时,希望有用吧

懵懵爸爸
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
three.js mtl材质贴图未显示_threejs精灵贴图
weixin_39610964的博客
12-15 1015
“由于工作需要，在三维场景中绘制‘监测点’时使用的cylinder替代的监测点并绘制断面，突发奇想想用精灵试试。”01—入坑代码 在搜索了大量资料后，发现绘制图片可以使用canvas绘制图片后再以材质加载到精灵上，各种尝试后场景中始终不显示精灵。代码如下(注：有可能是我操作问题，欢迎留言讨论)： let canvas = document.createElement('canvas...
小程序集成Three.js开发常见问题
3D模型素材库
12-28 1206
使用Three.js框架开发小程序时常见问题的解决方法
vite使用threejs加载fbx模型
最新发布
weixin_55209970的博客
07-10 314
会动的fbx模型 去mixamo上下载就行。
ThreeJs 加载人物模型， 在ios 上显示的时候，偶尔会出现人物贴图加载不出来， 导致模型变成了黑色的
york_饭的博客
04-11 1523
原文链接： 查询了很久， 添加这个参数就好了 注意 ： 在mac 上会导致这个判断是false 状态， 所以要直接看到效果，可以直接把里面的代码提出来 //修复部分纹理随机黑色问题 const IS_IOS = /^(iPad|iPhone|iPod)/.test(window.navigator.platform) || (/^Mac/.test(window.navigator.platform) &&amp
threejs中导入fbx模型相关问题
gao123ming的专栏
04-11 7799
        最近有兴趣在学习threejs，对于模型导入一直存在一个问题，我是想在网上下载一下好看的模型，做简单的关键帧动画，然后通过3dmax导出fbx模型，在导入threejs中，但是一直不成功，要不就是提示不支持二进制格式的模型，要不就是说fbx版本过低。        试错经历：       1、一开始用的max2014,问题一直存在无法解决       2、听有人说高版本的max导出...
Three.js 在iPhone手机上部分贴图黑色问题
eevee_1的博客
03-31 1369
最近在测试移动端适配性的时候发现模型的贴图有时候会变成纯黑色，每次刷新变黑的部分还会随机不一样，而且首次加载一般没问题，关掉网页再次加载的时候极高概率触发。 搜了一下发现Three.js官方也知道这个问题，问题的起因是：ios15.x系统中更新了贴图机制，导致贴图无法加载，three.js官方给出的结论是这是ios本身的bug，可以通过如下方式改善这个问题： //修复部分纹理随机黑色问题 ...
THREE.js模型贴图不显示
qq_40245044的博客
06-11 6708
THREE.js加载模型有时候贴图加载不出来，材质出现问题，整个模型为黑色，手动加载一个新的材质贴图即可，代码如下 var loader = new THREE.TextureLoader(); var texture = loader.load('xxx.png', function () { }); //material 类型自己选择 var material = new THREE.Mes...
Threejs加载模型
小金是个小菜鸡
06-10 1319
<script src="/javascripts/dop.min.js"></script> <script src="/javascripts/three.js"></script> <script src="/javascripts/OrbitControls.js"></script> <script src="/javascripts/STLLoader.js"></script> <!--模.
vue3中使用threejs加载fbx模型.zip
07-04
在Vue3中集成Three.js以加载FBX模型是一项常见的任务，尤其在开发3DWeb应用时。Three.js是一个强大的JavaScript库，用于在浏览器中创建和展示3D对象，而FBX是一种广泛使用的3D模型格式，它包含了丰富的动画和材质...
ThreeJS加载glb模型实用案例
01-26
在Web开发领域，Three.js是一个非常流行的JavaScript库，它用于创建和展示3D图形，而无需复杂的编程。Three.js利用WebGL技术，这是一种基于OpenGL标准的JavaScript API，可以在浏览器上实现硬件加速的3D渲染。本篇...
iOS 实现简单的加载等待动画示例（思路与实现）
08-30
本篇文章主要介绍了iOS 实现简单的加载等待动画示例（思路与实现），小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
Unity3D 游戏引擎之FBX模型的载入与人物行走动画的播放
11-11
雨松MOMO Unity3D 游戏开发系列博文之Unity3D Unity3D 游戏引擎之FBX模型的载入与人物行走动画的播放，欢迎大家下载阅读，哇咔咔～～
Three.js fbx文件导入 源码
04-26
在Three.js中，导入FBX（Autodesk FBX）文件是一项常见的任务，因为FBX是一种广泛使用的三维模型格式，支持动画、材质、骨骼等复杂数据。Three.js是一个基于WebGL的JavaScript库，它允许开发者在浏览器中创建和展示...
threejs_fbx.zip
09-06
通过这个“threejs_fbx.zip”项目，你将能够看到如何实际操作这些步骤，学习如何在Three.js中加载、展示和动画化FBX模型。这将有助于提升你的3D web开发技能，尤其是如果你对3D建模和Web交互感兴趣的话。记得仔细...
Threejs 加载模型贴图不显示，只显示黑色的模型，也没报404错误的解决方案
李二狗的博客
10-16 7377
看看是不是坑爹的建模把颜色材质颜色设置成黑色了！ 颜色贴图。默认为null。纹理贴图颜色由漫反射颜色.color调节。 贼坑
解决：使用threejs时 苹果手机无法加载obj文件
sinat_41273766的博客
12-25 682
使用threejs时 苹果手机无法加载obj文件
Threejs最新版本应用实例加载GLTF外部模型，同时加载动画
weixin_43851854的博客
06-13 5397
Threejs中有很多支持外部模型导入的库。在这里我将使用GLTF模型作为展示。 首先，先要引入官方给的引入库。 <script src="js/GLTFLoader.js"></script> 然后就是普普通通的搭建一个实验场地，一个控制器，方便观察 var Scene,camera,renderer; init(); initcamera(); function init() { Scene=new THREE.Scene();
three.js场景中看不到模型/看不到阴影
weixin_39559449的博客
04-02 4697
参考：火辣辣前端博客 一、three.js渲染的场景中看不到模型的几种可能： 1、未渲染 你可能并未加载渲染函数，或者未将场景渲染出来，虽然这个可能性很小很小，但初期我真的犯过…… function animate() { requestAnimationFrame(animate); renderer.render(scene, camera); } 2、场景中未加灯光 未加...
threejs 加载fbx
08-30
你可以使用Three.js库来加载FBX模型。首先，确保你已经将Three.js库添加到项目中。然后，按照以下步骤加载FBX模型： 1. 导入所需的库： ```javascript import * as THREE from 'three'; import { FBXLoader } from 'three/examples/jsm/loaders/FBXLoader'; ``` 2. 创建一个场景、相机和渲染器： ```javascript const scene = new THREE.Scene(); const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000); const renderer = new THREE.WebGLRenderer(); renderer.setSize(window.innerWidth, window.innerHeight); document.body.appendChild(renderer.domElement); ``` 3. 创建并添加光源到场景： ```javascript const ambientLight = new THREE.AmbientLight(0xffffff, 0.5); scene.add(ambientLight); const directionalLight = new THREE.DirectionalLight(0xffffff, 0.5); directionalLight.position.set(10, 10, 10); scene.add(directionalLight); ``` 4. 使用FBXLoader加载FBX模型： ```javascript const loader = new FBXLoader(); loader.load('path/to/your/model.fbx', (fbx) => { scene.add(fbx); }); ``` 确保将`path/to/your/model.fbx`替换为你实际的FBX文件路径。 5. 添加渲染循环以更新场景： ```javascript function animate() { requestAnimationFrame(animate); // 对模型进行动画或改变属性等操作 renderer.render(scene, camera); } animate(); ``` 现在，你应该能够加载并显示FBX模型了。记得替换FBX文件的路径，并根据需要进行其他操作，如对模型应用纹理、添加动画等。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

懵懵爸爸

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值