基本场景中断从three.js v87过渡到v88或v89

时间:2018-02-19 19:07:36

标签: three.js

有没有人知道为什么以下中断为three.min.js从r87更新为r88或r89?这只是使用来自three.js相关培训网站的基础知识。使用r87或更早版本,将显示一个多维数据集。使用r88或r89,只有一块黑色帆布。我在Chrome,Firefox和& IE。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Demo</title>
<script src="jquery-3.3.1.min.js"></script>
<script src="three.min.js"></script>
<script>
    var renderer = null, scene = null, camera = null;

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

    $(document).ready(function() {
        var canvas = document.getElementById("webglcanvas");

        scene = new THREE.Scene();

        renderer = new THREE.WebGLRenderer({canvas: canvas, antialias: true});
        renderer.setSize(canvas.width, canvas.height);

        camera = new THREE.PerspectiveCamera(60, canvas.width / canvas.height, 0.1, 400);
        camera.position.set(60, 100, 100);
        scene.add(camera);

        camera.lookAt({"x": 50.0, "y": 50.0, "z": 50.0});

        var light = new THREE.PointLight(0xffff00);
        light.position.set(50, 50, 50);
        scene.add(light);

        var geometry = new THREE.BoxGeometry(50, 50, 50);
        var material = new THREE.MeshNormalMaterial();
        var cube = new THREE.Mesh(geometry, material);
        scene.add(cube);

        render();
    });
</script>
</head>
<body>
   <canvas id="webglcanvas" width="480" height="300"></canvas>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

以下是无效的three.js代码,并且从未有效的three.js代码:

camera.lookAt( { "x": 50.0, "y": 50.0, "z": 50.0 } );

使用

camera.lookAt( 50, 50, 50 );

camera.lookAt( myVector3 );

three.js r.90