如何解决threejs+vue 的模型重合问题，threeBSP 没有THREE.Geometry的问题

最新推荐文章于 2024-06-12 21:15:59 发布
最新推荐文章于 2024-06-12 21:15:59 发布
阅读量2.3k 收藏 3
点赞数 1
分类专栏： threeJs vue 文章标签： vue.js 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_40994735/article/details/120899422
版权
vue 同时被 2 个专栏收录
45 篇文章 1 订阅
订阅专栏
threeJs
9 篇文章 1 订阅
订阅专栏
博客内容讲述了在更新Three.js到新版本后，由于Geometry被删除导致无法找到对应模型的问题。作者提出了两种解决方案：一是回退到包含Geometry的旧版本，但可能会遇到`geometry.faces`的错误；二是尝试使用替代库jthreebsp，并指定了特定版本npminstallthree@0.126.1以避免`computeFaceNormals()`函数不存在的错误。
摘要由CSDN通过智能技术生成

问题存在的原因的新版本的threejs将对应的Geometry删除，所有会找不到对应的模型。

解决方案，将版本降低到Geometry还存在的情况，但是可能会出现geometry.faces的报错，目前暂时不知道解决方案

使用新的库进行修改，换使用jthreebsp

jthreebsp的gitee地址

使用这个必须修改threejs的版本为

npm install three@0.126.1

不然会报result.geometry.computeFaceNormals() 不是一个函数

圣京都
关注
  • 1
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 5
    评论
专栏目录
vue+threejs+threeBSP 创建墙
tutouxiaoyaonie的博客
09-29 972
vue+threejs+threeBSP 创建墙
vue中使用的threebsp.zip
12-03
在vue中使用的网格对象操作函数库threebsp.js,以实现网对象的相交intersect、联合union、相减subtract
第八章 Three.js 高级几何体
最新发布
一名全栈开发工程师
06-12 554
Three.js 提供了和来创建自定义几何体。是一个较为简单和直观的方式，而更为高效，适用于更复杂的几何体。
Three.js系列-报错export ‘Geometry‘ (imported as ‘THREE‘) was not found in ‘three‘
tangdou369098655的博客
06-07 1127
所以只需要搜索代码中的THREE.Geometry。欢迎大家指出文章需要改正之处~
Three.js 合并geometry 出现的问题
weixin_45860876的博客
05-08 3062
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档 文章目录前言一、pandas是什么？二、使用步骤1.引入库2.读入数据总结 前言 提示：这里可以添加本文要记录的大概内容： 例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。 提示：以下是本篇文章正文内容，下面案例可供参考 一、pandas是什么？ 示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。 二、使用步骤 1.引入库 代码
vue + threejs 使用ThreeBSP
hello world
10-18 1192
最新的包 由于少核心 face3 和Geometry需要安装老版本 查看 three 的版本 npm show three versions 安装three.js npm install three@0.110.0 --save 安装tthreebsp npm i tthreebsp 引入three.js 和tthreebsp import * as THREE from 'three' const ThreeBSP = require('tthreebsp')(THREE) ...
使用ThreeBSP库进行实现差集(相减)、并集(组合、相加)、交集(两几何体重合的部分)
xyphf的博客
11-29 1790
简介 之前我们一直使用Three.js默认提供的几何体，今天我们使用ThreeBSP库，可以将现有的模型组合出更多个性的模型来使用。我们可以使用ThreeBSP库里面的三个函数进行现有模型的组合，分别是:差集(相减)、并集(组合、相加)、交集(两几何体重合的部分)。下面我们介绍一下三个函数, 并提供每个方法的简单案例。 使用方法: <script src="../../1ib/ThreeBSP.js"></script> var sphereBSP = new ThreeBS.
three.js+vue3打造VR掌上博物馆源代码
05-17
这个资源是我自己在CSDN上的视频课程的源代码，课程地址：...购买源代码者，如果有不懂的地方可以私信我，我可以协助购买者把项目跑起来，并且回答购买者提出的问题。 凡盗版者，追究到底！
vue+three.js展示nrrd+vtk3D模型.zip
12-22
在本项目中，“vue+three.js展示nrrd+vtk3D模型.zip”是一个结合了Vue.js前端框架、Three.js三维渲染库以及nrrd和vtk格式的数据来展示3D模型的应用实例。以下是对这些技术及其整合应用的详细解释： **Vue.js** 是一...
three.js+vue+gltf模型
05-21
three.js+vue+gltf模型
基于vue3，three.js,3D智慧园区
11-09
在构建“基于vue3，three.js,3D智慧园区”的项目中，我们涉及了多个关键技术和概念，这些技术是现代Web开发中3D图形和交互式应用的核心。下面将详细阐述这些知识点： **Vue3**: Vue.js是一个流行的前端JavaScript...
使用three.js+vue框架实现三维交互仿真.zip
12-10
使用three.js+vue框架实现三维交互仿真.zip使用three.js+vue框架实现三维交互仿真.zip使用three.js+vue框架实现三维交互仿真.zip使用three.js+vue框架实现三维交互仿真.zip使用three.js+vue框架实现三维交互仿真.zip...
vue+three.js开发,引入ThreeBSP问题
qq_42033351的博客
11-15 2785
初学threejs,使用vue开发，按照网上教程写demo的需要引入ThreeBSP这个库，按照demo安装ThreeBSP这个库 npm i tthreebsp 组件引入 //必须在前面先引入THREE包 import * as THREE from 'three' //再把THREE当作参数传入方可使用 const ThreeBSP = require('tthreebsp')(THREE) 但开发使用不行，报下图的错误，上网搜了很多解决方法都不行，个人水平不行，想的脑壳疼，这个库使用的不多吧，查
ThreeBSP.js如何在vue当中使用
wxj_ios的博客
10-17 3145
资源地址：https://download.csdn.net/download/wxj_ios/10727140 1、在ThreeBSP的最上方加入 import * as THREE from 'three'; 2、在最下方加入 export default ThreeBSP; 3、在需要引入ThreeBSP的地方加入 import ThreeBSP from './Three...
vue中threeBSP使用 替代方案
qq_41604498的博客
05-17 1743
vue项目中使用threejs进行项目开发的时候需要使用threeBSP 但是安装threeBSP的包之后出现了很多错误 现在有一个替代方案 就是使用 three-js-csg 1.首先装包 2.引入 import * as THREE from 'three' const ThreeBSP = require('three-js-csg')(THREE) 3.使用 let Bsp=new ThreeBSP(Object); 若上述使用中出现如下错误 应该是threejs版本的问题，我使用的是107
three.js之高级几何体-使用二元操作组合网格(vue中使用three.js38)
点燃火柴的博客
12-07 763
二元操作组合网格介绍1.ThreeBSP方法介绍2.ThreeBSP方法使用步骤2.1ThreeBSP库引入2.2使用二元操作方法3.demo说明4.demo代码 1.ThreeBSP方法介绍 目前我们创建几何体都是一次单独创建一个。实际上我们有一个库专门用来对网格对象进行相交、联合和相减的操作，这个库就是THREEBSP，我们通过它可以更加高效的创建出想要的三维图形，这个库提供了以下三个方法： 名称 描述 intersect（相交） 该函数可以把两个几何体相交的部分创建出新的几何体，即两个
VUE+THREEJS 创建完整会议室三维模型
u014328243的博客
06-13 7845
最近学习threejs有些时间了，就想着着手做些东西。前端Vue里面引入thrssjs，先给大家看下效果。 用到的知识点只要有三维几何体BoxGeometry、材质、纹理贴图、PlaneGeometry、CylinderGeometry，以及BSP的二元操作等。在使用Vue引入threejs中，我采用的方法是直接在index.html中引用。 初次尝试，代码写的臃肿杂乱，不过比较适合刚入门的小伙伴，后续我也会将样例发布到云服务器上，可供大家在线预览。有不足之处欢迎指出，下方评论留言。大神请略过。。。
three.js加载OBJ格式模型(vue中使用three.js51)
点燃火柴的博客
01-13 2258
加载OBJ格式模型1.demo效果2.实现要点2.1 OBJ模型放置路径2.2 加载OBJ模型3.demo代码 1.demo效果 如上图，该demo通过OBJLoader加载了OBJ格式的模型，并添加了棕色材质 2.实现要点 2.1 OBJ模型放置路径 vue中加载文件时默认的路径为public下，所以需要加载的文件放在该路径下，同时在vue的data属性中创建变量publicPath，此变量的值是vue中的环境变量process.env.BASE_URL data() { return {
使用ThreeBSP库进行Three.js网格组合
weixin_40856652的博客
06-16 607
使用 ThreeBSP 库里可以进行现有模型的组合，分别是:差集(相减)、并集(组合、相加)、交集(两几何体重合的部分
threejs+vue智慧园区代码
01-16
比如，可以集成传感器数据或者实时监控信息，通过Three.js和Vue将这些信息可视化显示在园区模型中，帮助园区管理者和访客了解园区的实时状态。 总而言之，结合Three.js和Vue可以为智慧园区创建一个生动、交互式的3D...
评论 5
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

打赏作者

圣京都

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

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

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

打赏作者

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

抵扣说明：

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

余额充值