选取gltf格式时,出现模型为黑色,模型出不来

原因:

我们设计部可能是用maya或者3dmax去做;在模型导出时,没有gltf格式;如果maya或者3dmax导出obj然后导进blender,再导出gltf格式,就容易再格式转换的过程中出现数据丢失。(这时候你会发现你展示出来的模型为黑色,在你代码没有问题的情况下,你会发现后台也不报错,别的模型也可以展示出来)

解决办法:

我们把设计部做出来的模型导出来,放进这个网站进行格式转换 www.sketchfab.com  模型网站(gltf,fbx); https://sketchfab.com/3d-models?date=week&features=downloadable&sort_by=-likeCount;同时设计部还需要根据设计搞,在网站上进行进一步的微调;这个网站上展示的效果,就是导出后,我们webgl这边可以正常展示的效果。

如果代码没有问题,那么试着给它放大缩小;我在做项目的时候就有遇到过,给模型放大了10000倍,模型才出来那么一丢丢。

格式转换与代码测试相关链接:

3D技术路线系统介绍:disigner -> viewer 3D引擎
   https://www.khronos.org/gltf/

3D查模型器: 文件直接拖进去  https://gltf-viewer.donmccurdy.com/

      http://39.106.15.17:3000/#model=/models/hole-table/scene.gltf 3D模型查看器

3D展示网站:
  www.sketchfab.com 模型网站(gltf,fbx)
  https://sketchfab.com/3d-models?date=week&features=downloadable&sort_by=-likeCount

sketchfab developer

 web使用方式:https://help.sketchfab.com/hc/en-us/articles/203509907-Embedding-your-models?utm_source=website&utm_campaign=embedpopup#embed-options
                  总结:三种方式
                  1.直接获取    https://sketchfab.com/models/442c548d94744641ba279ae94b5f45ec?autospin=0.5
                  2.iframe方式  <iframe src="https://sketchfab.com/models/442c548d94744641ba279ae94b5f45ec/embed?autostart=1&autospin=0.5"></iframe>
                  3.js API方式:https://static.sketchfab.com/api/sketchfab-viewer-1.5.1.js 
     API调用      https://sketchfab.com/developers/viewer  
   
   iframe嵌入式:<iframe src="https://sketchfab.com/models/442c548d94744641ba279ae94b5f45ec/embed?autostart=1&autospin=0.5"></iframe>
   view API模式:https://sketchfab.com/developers/viewer
  demo网站:
  https://demos.littleworkshop.fr/infinitown

  编码测试网站:www.codepen.io
 Cannon.js技术路线

  glTF viewer:播放glTF动画,  .glTF(描述文件JSON) .bin 动画文件(animation data) texture文件夹:材质,图片.jpg,png
  js源码代码:https://github.com/donmccurdy/three-gltf-viewer
  在线播放器(将三个文件(夹)拖入网页中,记住拖进去 open方式不行):https://gltf.insimo.com/
 desktop:桌面版本:https://github.com/donmccurdy/three-gltf-viewer/releases
 D:\ProgramFile\gltf-viewer-win32-ia32

three.js example:three.js样例
 three.js loader:
 示例:    https://github.com/mrdoob/three.js/tree/master/examples/js/loaders
 glTF示例:https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/GLTFLoader.js

three.js vs Cannon.js 文章
 https://www.codercto.com/a/33760.html

sketchfab模型破解下载:
 https://imjad.cn/archives/lab/ripping-sketchfab-models

http://m.3dhoo.com/news/guowai/39935.html
 https://blog.csdn.net/weixin_43081805/article/details/88891200
 https://www.ddd.online/mall/search?keyWords=%E5%A4%AA%E7%A9%BA

ThreeJS模型展示为黑色,模型出不来的更多相关文章

  1. Linux 网络编程的5种IO模型:异步IO模型

    Linux 网络编程的5种IO模型:异步IO模型 资料已经整理好,但是还有未竟之业:复习多路复用epoll 阅读例程, 异步IO 函数实现 背景 上一讲< Linux 网络编程的5种IO模型:信 ...

  2. padding标准盒模型和怪异盒子模型

    我们都知道padding是为块级元素设置内边距 但是在使用过程中,我们却会遇到一些问题.padding的标准盒模型和怪异盒模型 padding盒子模型 我们通过demo来讲这个问题,用文字干讲第一没意 ...

  3. eventloop & actor模式 & Java线程模型演进 & Netty线程模型 总结

    eventloop的基本概念可以参考:http://www.ruanyifeng.com/blog/2013/10/event_loop.html Eventloop指的是独立于主线程的一条线程,专门 ...

  4. 标准盒模型与IE盒模型之间的转换

    首先上图,这两张很明显可以看出IE盒模型和标准盒模型之间的差别. 当然今天不是去细细追究两种模型具体是怎么去计算布局的,那个很多文章已经已经有过了,不再重复.以前刚开始学习盒模型的时候,就学到的是IE ...

  5. Reactor三种线程模型与Netty线程模型

    文中所讲基本都是以非阻塞IO.异步IO为基础.对于阻塞式IO,下面的编程模型几乎都不适用 Reactor三种线程模型 单线程模型 单个线程以非阻塞IO或事件IO处理所有IO事件,包括连接.读.写.异常 ...

  6. python的Web框架,Django模型系统二,模型属性,及数据库进阶查询

    原始数据接上篇文章来操作.可能需要查看后才能懂.点击这里查看 1.常用的模型字段类型 官方文档:https://docs.djangoproject.com/en/2.1/ref/models/fie ...

  7. V-rep学习笔记:机器人模型创建4—定义模型

    完成之前的操作后终于来到最后一步——定义模型,即将之前创建的几何体.关节等元素按层级关系组织成为一个整体. 将最后一个连杆robot_link_dyn6拖放到相应的关节(robot_joint6)下, ...

  8. IE盒模型与W3C盒模型区别

    前两天被人问到,叫我解释一下标准盒模型与IE盒模型,额,当时只能说,知道一点,但是没有深入的去探讨过,所以下来之后就自己写了例子,亲自去验证并且查看了网上的一些资料,现将其整理如下: 一.css盒模型 ...

  9. Spark编程模型(RDD编程模型)

    Spark编程模型(RDD编程模型) 下图给出了rdd 编程模型,并将下例中用 到的四个算子映射到四种算子类型.spark 程序工作在两个空间中:spark rdd空间和 scala原生数据空间.在原 ...

随机推荐

  1. 262K Color

    262K色=2^18=262144色. 320*240是指屏幕分辨率. 你可以理解为一块黑板,这款黑板宽是3.2M,长是2.4米,以1cm为最小单位,整个黑板被分为320*240个小格子,这个小格子里 ...

  2. winform中的小技巧【自用】

    一.C#在WinForm中怎样让多行TEXTBOX的换行 今天做项目,有一段提示文字需要弹出来,由于太长,我就想能不能让它换行.然后就百度了一下,嘿嘿,方法很好用哦. 原文链接:https://blo ...

  3. 2019 pycharm激活码

    http://lookdiv.com 里面有,钥匙:1211268069 激活码网址里面有 lookdiv.com 里面的钥匙就是lookdiv.com

  4. javaScript的事件冒泡事件捕获

    (1)冒泡型事件:事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发. IE 5.5: div -> body -> document IE 6.0: div ...

  5. Django框架(二十一)—— Django rest_framework-权限组件

    目录 Django rest_framework-权限组件 一.权限组件的使用 1.使用语法 2.全局使用.局部使用.局部禁用权限 二.源码分析 1.Book中没有as_view 2.APIView的 ...

  6. VC2008中将CString转换成const char*的一种有效方法

    文章转载自http://blog.csdn.net/lanbing510/article/details/7425613 在Visual Studio 200X下,CString直接转换成const ...

  7. PHP简单导出Excel表格

    <?php header('Content-Type: application/vnd.ms-excel'); header('Content-Disposition: attachment; ...

  8. input输入框数字转带千分位的字符串

    数字转带千分位的字符串 思路 先获取要转换的数字,对其进行分割 小数部分具体需要保留多少位,具体处理 整数部分用正则做替换 将小数部分和整数部分合计 代码 注意: 本文是基于 jQuery 写的,稍稍 ...

  9. LeetCode Arrary Easy 35. Search Insert Position 题解

    Description Given a sorted array and a target value, return the index if the target is found. If not ...

  10. Postfix+Dovecot+MySQL搭建邮件服务器

    网上有很多使用Postfix搭建邮件服务器的文章,但目前貌似没有看到较为完整的一篇.本例将尝试在Ubuntu系统中使用Postfix+Dovecot+MySQL搭建邮件服务器. 说到邮件服务器,网上有 ...