ThreeBSP.js如何在vue当中使用

资源地址：https://download.csdn.net/download/wxj_ios/10727140

1、在ThreeBSP的最上方加入

import * as THREE from 'three';

2、在最下方加入

export default ThreeBSP;

3、在需要引入ThreeBSP的地方加入

import ThreeBSP from './ThreeBSP';

4、一段示例代码

THREEModel.prototype.createBSPT = function () {
  // 创建球形几何体
  let sphereGeometry = new THREE.SphereGeometry(50, 20, 20);
  let sphere = this.createMeshT(sphereGeometry);
  // 创建立方体几何体
  let cubeGeometry = new THREE.BoxGeometry(30, 30, 30);
  let cube = this.createMeshT(cubeGeometry);
  cube.position.x = -50;
  // 生成ThreeBSP对象
  let sphereBSP = new ThreeBSP(sphere);
  let cubeBSP = new ThreeBSP(cube);
  // 进行并集计算
  let resultBSP = sphereBSP.subtract(cubeBSP);
  // 从BSP对象内获取到处理完后的mesh模型数据
  let result = resultBSP.toMesh();
  // 更新模型的面和顶点的数据
  result.geometry.computeFaceNormals();
  result.geometry.computeVertexNormals();
  // 重新赋值一个纹理
  let material = new THREE.MeshPhongMaterial({color: 0x00ffff});
  result.material = material;
  return result;
}

THREEModel.prototype.createMeshT = function (geom) {
  //  创建一个线框纹理
  let wireFrameMat = new THREE.MeshBasicMaterial({opacity: 0.1, wireframeLinewidth: 0.5});
  wireFrameMat.wireframe = false;
  // 创建模型
  let mesh = new THREE.Mesh(geom, wireFrameMat);
  return mesh;
}