时间戳

首页 > 解决方案 > 我想在我用three.js 安装的obj 扩展模型的某些部分添加一个热点。我该怎么做？

javascript - 我想在我用three.js 安装的obj 扩展模型的某些部分添加一个热点。我该怎么做？

问题描述

我可以向使用 Three.js 加载的模型添加点击事件，但无法向已上传模型的特定部分添加点击事件。例如，我可以在我安装的汽车模型上进行点击事件，但我想做的正是这样：当我点击汽车的轮子时，我想在控制台上写“轮子”。当我点击玻璃时，我想写“玻璃”。

我该怎么做？

const objLoader = new THREE.OBJLoader2();
objLoader.loadMtl('bugatti.mtl', null, (materials) => {
  objLoader.setMaterials(materials);
  objLoader.load('bugatti.obj', (event) => {
    const root = event.detail.loaderRootNode;
    scene.add(root);
    myModel = root;
       const domEvents = new THREEx.DomEvents(camera, renderer.domElement)

    domEvents.addEventListener(myModel, 'click', event => {
        console.log("car");
    });

标签： javascriptthree.js

解决方案

最好在设计阶段解决此问题，并确保您的模型确实由多个独立的网格组成，这些网格组合在一起形成一个更复杂的对象。three.js这样，在（和任何其他 3D 引擎）中选择单个组件会容易得多。

推荐阅读