H42*_*H42 4 javascript rendering render computer-vision three.js
我正在尝试OrbitControls
在 THREE.js 中使用。如果我let cameraControl = new OrbitControls(camera)
从下面删除该行,则不会出现错误。但是现在,我有“未捕获的类型错误:无法读取未定义的属性‘addEventListener’”
我尝试更改OrbitControls(camera)
为THREE.OrbitControls(camera)
,然后出现“未捕获的类型错误:THREE.OrbitControls 不是构造函数”。
我尝试OrbitControls.js
使用<script src=...></script>
external"module"
而不是导入import {OrbitControls} from ...;
,但它不起作用,我也尝试移动let cameraControl = new OrbitControls(camera)
到其他行,但也不起作用。
任何想法如何解决?
<body>
<script type="module">
import * as THREE from 'https://threejsfundamentals.org/threejs/resources/threejs/r115/build/three.module.js';
import {OrbitControls} from 'https://threejsfundamentals.org/threejs/resources/threejs/r115/examples/jsm/controls/OrbitControls.js';
let scene, renderer, camera
let cube
function init() {
scene = new THREE.Scene()
renderer = new THREE.WebGLRenderer()
renderer.setSize(window.innerWidth, window.innerHeight)
document.body.appendChild(renderer.domElement)
camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 0.1, 100)
let cameraControl = new OrbitControls(camera)
camera.position.set(10, 10, 10)
camera.lookAt(scene.position)
// cube
cube = new THREE.Mesh(new THREE.BoxGeometry(1, 1, 1))
scene.add(cube)
}
function render() {
requestAnimationFrame(render)
renderer.render(scene, camera)
}
init()
render()
</script>
</body>
Run Code Online (Sandbox Code Playgroud)
让 cameraControl = new OrbitControls(camera)
始终像这样创建控件:
let cameraControl = new OrbitControls(camera, renderer.domElement);
Run Code Online (Sandbox Code Playgroud)
第二个参数现在是强制性的。