声明: 原文地址:vue集成vue-3d-model预览模型 - 简书

该组件是基于Three3d开发 由于对有透明贴图或者双面贴图的模型文件不友好 不能正常展示会出现如下效果

明显的透明贴图显示

双面贴图的显示效果

由于项目需求显示成这样肯定不是我想要的效果、通过对原文作者代码的查阅,参考了Three3D的相关文档

对源代码进行了修改 可以完美显示双面贴图 以及透明贴图的正确显示 效果如下:

下面贴上修改后的代码GitHub仓库

GitHub - killerFeel/vue-3d-model: 一个基于three3d展示三维模型的组件库

如何在项目中使用?

  1. git克隆代码到本地 git clone https://github.com/killerFeel/vue-3d-model.git
  2. 用编译器打开项目 npm run build 构建成dist包
  3. 在vue项目中通过 npm i vue-3d-model@1.3.1 -ss 下载插件
  4. 打开node_modules文件夹 找到vue-3d-model文件夹 将里面的dist文件夹替换成我们构建的dist包 然后就可以完美运行项目展示了!

最后感谢原插件封装者 感谢大家的阅读!Thanks♪(・ω・)ノ

vue-3d-model 对三维模型(.fbx.gltff.obj等)的展示,三维模型展示透明贴图 以及双面贴图显示相关推荐

  1. html vue 3D之Three.js(第二节)

    第一节:html vue 3D之Three.js(第一节)_加金开发的博客-CSDN博客 实列模型下载:https://download.csdn.net/download/qq_33131171/8 ...

  2. vue-3d-model:一个展示三维模型的 Vue 组件

    vue-3d-model vue.js 3D model viewer component, based on threejs, inspired by model-tag 一个展示三维模型的Vue组 ...

  3. 碗状碎块三维模型的下载(.PLY格式)3D model file with Bowl-shaped Broken Piece (.ply format)

    碗状碎块三维模型的下载(.PLY格式) 3D model file with Bowl-shaped Broken Piece (.ply format) 上传的碗状碎块共有两组,这些碎块在断裂曲面处 ...

  4. 一起学WP7 XNA游戏开发(八. 让3d model动起来)

    如何让3d model动起来,其实就是要给model的bone设置动作,这样整个model就会动起来了. 一.获取Bones 在fbx文件中可以看到所有bones的名称,这样就可以通过名称来获取到bo ...

  5. b3dm ~ ( Batched 3D Model )

    目录 1. b3dm 概念解析 1. What's b3dm 2. b3dm 格式的数据结构有两部分组成 : header / body 1. b3dm 数据也是基于 gltf 的 ( 单模型基础上做 ...

  6. 视频教程-【CVPR2018】3D Pose Estimation and 3D Model Retriev-强化学习

    [CVPR2018]3D Pose Estimation and 3D Model Retriev 从事IT领域8年,精通计算机视觉. 吴勤明 ¥50.00 立即订阅 扫码下载「CSDN程序员学院AP ...

  7. Face Swapping under Large Pose Variations: a 3D Model Based Approach论文阅读笔记

    题目:Face Swapping under Large Pose Variations: a 3D Model Based Approach 翻译:大姿态变化下的人脸交换:一种基于三维模型的方法 摘 ...

  8. 人脸检测--Face Detection with End-to-End Integration of a ConvNet and a 3D Model

    Face Detection with End-to-End Integration of a ConvNet and a 3D Model ECCV2016 mxnet code:https://g ...

  9. 【论文阅读】6-Automatic 3D Model Construction for Turn-Table Sequences

    [论文阅读]6-Automatic 3D Model Construction for Turn-Table Sequences 1.知识点回顾 2.论文阅读 2.1.input& outpu ...

最新文章

  1. 一位Python初学者的自白:Python小白眼中的装饰器
  2. InnoDB 引擎独立表空间 innodb_file_per_table
  3. unity添加对象实例_【Unity】6.3 通过 C# 脚本创建和访问游戏对象
  4. mysql 后10条_Mysql 保留最新的10条数据
  5. mysql故障切换_MySQL故障切换笔记之应用无感知设计详解
  6. 访问量冲破1000大关,截图庆祝!
  7. Error in mounted hook: “TypeError: Cannot read properties of undefined (reading ‘i
  8. Android 自定义View(二)绘制一个封闭多边形
  9. 网页调用智能IC卡读写器的解决方案
  10. QT 与webkit(wke) 交互
  11. sqlyog证书秘钥(注册码)
  12. Android逆向分析实例(三)-解密微信EnMicroMsg.db数据库
  13. springboot项目去除druid监控的广告超链接等
  14. BZOJ1001狼抓兔子(网络流最小割)
  15. 高速串行收发器的预加重与均衡
  16. tex常用函数 上下行对齐_latex 部分右对齐
  17. 软件测试笔记——如何测试一个矿泉水瓶?
  18. C语言写的一个贪吃蛇小游戏(windows系统)
  19. 即兴演讲的秘诀结构(一)
  20. 2022年第十三届蓝桥杯大赛软件类国赛 C/C++ 大学B组

热门文章

  1. SQL server 2008R2安装错误:试图执行未经授权的操作
  2. js删除对象中所有值为null和undefined的属性
  3. csf计算机课程,来个操作系统的-[哈工大][操作系统][44讲][csf]
  4. 腾讯云同一服务器绑定多个IP
  5. c#进行url加密解密与jquery前端加密解密
  6. 人保财险5.88亿入股银河证券
  7. 从零开始学java-(三)for ZCL:java基本数据类型
  8. 一个php项目怎么快速运行环境,PHP 运行环境快速搭建
  9. vue 调用微信分享接口 分享截图图片
  10. STM32学习 3:GPIO管脚配置与第一个STM32实验:LED灯闪烁