在threejs中 想实现点一下按钮 在threejs场景里换一个模型显示

你可以按照以下步骤在 Three.js 中实现点击按钮切换模型的功能：

1. 首先，在 HTML 中添加一个按钮元素，例如：

   <button onclick="changeModel()">切换模型</button>

2. 创建两个 Three.js 场景对象，分别用于显示两个不同的模型。

3. 创建一个变量来保存当前显示的模型场景对象的引用。

   var currentScene = scene1; // 初始时显示第一个场景

4. 在 `changeModel()` 函数中，切换当前场景变量的值，并将当前场景中的模型添加到 Three.js 场景中或从场景中移除。

   function changeModel() {
       if (currentScene === scene1) {
           scene.remove(model1);
           scene.add(model2);
           currentScene = scene2;
       } else {
           scene.remove(model2);
           scene.add(model1);
           currentScene = scene1;
       }
   }

在这个例子中，我们创建了两个模型 `model1` 和 `model2`，并将它们分别添加到 `scene1` 和 `scene2` 场景中。在 `changeModel()` 函数中，我们检查当前显示的场景是哪一个，并根据需要添加或移除相应的模型，同时更新当前场景变量的值。

5. 最后，在 Three.js 渲染循环中，渲染当前场景。

完整的代码示例：

var scene1 = new THREE.Scene();
var scene2 = new THREE.Scene();

var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
camera.position.z = 5;

var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

var geometry1 = new THREE.BoxGeometry();
var material1 = new THREE.MeshBasicMaterial({ color: 0xff0000 });
var model1 = new THREE.Mesh(geometry1, material1);
scene1.add(model1);

var geometry2 = new THREE.SphereGeometry();
var material2 = new THREE.MeshBasicMaterial({ color: 0x00ff00 });
var model2 = new THREE.Mesh(geometry2, material2);
scene2.add(model2);

var currentScene = scene1;

function changeModel() {
    if (currentScene === scene1) {
        scene.remove(model1);
        scene.add(model2);
        currentScene = scene2;
    } else {
        scene.remove(model2);
        scene.add(model1);
        currentScene = scene1;
    }
}

function render() {
    requestAnimationFrame(render);
    renderer.render(currentScene, camera);
}
render();

这个例子中，我们创建了两个不同的模型场景，并且在点击按钮时切换它们。当当前场景切换时，我们将场景中的模型添加到或从场景中移除，然后在 Three.js 渲染循环中渲染当前场景。