Attempting to run a functional three.js code using release 119 of three.js (instead of r79) has resulted in an error being thrown by the previously functioning code:
THREE.Matrix4: .makePerspective() has been redefined and has a new signature. Please check the docs.
There appears to be only one Google search result related to this issue (this question). While I have reviewed the documentation, I could not find any mention of makePerspective. How can I resolve the following code (which displays some dots and allows zooming in and out)? Also referencing enter link description here.
container = document.createElement('div');
document.body.appendChild(container);
camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 1, 10000);
camera.position.set(0, 0, 150);
scene = new THREE.Scene();
scene.add(camera);
renderer = new THREE.WebGLRenderer({
clearAlpha: 1
});
renderer.setSize(window.innerWidth, window.innerHeight);
renderer.setClearColor(0x228B22, 1);
document.body.appendChild(renderer.domElement);
// Define a standard Circle
circle = new THREE.CircleGeometry(1, 20);
var max = 50;
var min = -50;
for (var i = 0; i < 100; i++) {
var object = new THREE.Mesh(circle.clone(), new THREE.MeshBasicMaterial({
color: new THREE.Color('yellow'),
opacity: 0.5
}));
object.position.x = Math.random() * (max - min) + min;
object.position.y = Math.random() * (max - min) + min;
object.position.z = 0;
scene.add(object);
}
document.addEventListener('wheel', onDocumentMouseWheel, false);
function onDocumentMouseWheel(event) {
console.log("mousewheel");
var fovMAX = 100;
var fovMIN = 1;
camera.fov -= event.wheelDeltaY * 0.05;
camera.fov = Math.max(Math.min(camera.fov, fovMAX), fovMIN);
camera.projectionMatrix = (new THREE.Matrix4()).makePerspective(camera.fov, window.innerWidth / window.innerHeight, camera.near, camera.far);
}
animate();
function animate() {
requestAnimationFrame(animate);
renderer.render(scene, camera);
}<body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r119/three.min.js"></script>
</body>