类型错误:array[i].call 不是函数错误 [英] TypeError: array[i].call is not a function Error

问题描述

我的代码是:

$(function() {
    var scene = new THREE.Scene();
    var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
    var renderer = new THREE.WebGLRenderer({antialias: true});

    renderer.setClearColor(0xdddddd);
    renderer.setSize(window.innerWidth, window.innerHeight);
    renderer.shadowMap.enabled = true;
    renderer.shadowMapSoft = true;


    var axis = new THREE.AxisHelper(10);
    scene.add(axis);

    var grid = new THREE.GridHelper(50, 5);
    var color = new THREE.Color("rgb(255,0,0)");
    grid.setColors(color, 0x000000);
    scene.add(grid);

    var Ground_geometry = new THREE.BoxGeometry( 20, 0.1, 20 );
    var Ground_material = new THREE.MeshPhongMaterial( {
        color: 0xa0adaf,
        shininess: 150,
        specular: 0xffffff,
        shading: THREE.SmoothShading
    } );

    var ground = new THREE.Mesh( Ground_geometry, Ground_material );
    ground.scale.multiplyScalar( 3 );
    ground.castShadow = false;
    ground.receiveShadow = true;
    scene.add( ground );

    var ambient = new THREE.AmbientLight( 0x404040 );
    scene.add( ambient );

    spotLight = new THREE.SpotLight( 0xffffff );
    spotLight.position.set( 10, 10, 15 );
    spotLight.castShadow = true;
    spotLight.shadowCameraNear = 8;
    spotLight.shadowCameraFar = 30;
    spotLight.shadowDarkness = 0.5;
    spotLight.shadowCameraVisible = false;
    spotLight.shadowMapWidth = 1024;
    spotLight.shadowMapHeight = 1024;
    spotLight.name = 'Spot Light';
    scene.add( spotLight );

    var controls = new THREE.OrbitControls( camera, renderer.domElement );
    controls.addEventListener( 'change', renderer );

    var cubeGeometry = new THREE.BoxGeometry(5, 5, 5);
    var cubeMaterial = new THREE.MeshPhongMaterial({
        color: 0x456574 ,
        shininess: 150,
        specular: 0x222222,
        shading: THREE.SmoothShading,
    });
    var cube = new THREE.Mesh(cubeGeometry, cubeMaterial);

    cube.position.x = 0;
    cube.position.y = 0;
    cube.position.z = 0;

    scene.add(cube);

    camera.position.x = 40;
    camera.position.y = 40;
    camera.position.z = 40;

    camera.lookAt(scene.position);

    renderer.render(scene, camera);
    $("#webGL-container").append(renderer.domElement);


    $(window).resize(function(){
        SCREEN_WIDTH = window.innerWidth;
        SCREEN_HEIGHT = window.innerHeight;
        camera.aspect = SCREEN_WIDTH / SCREEN_HEIGHT;
        camera.updateProjectionMatrix();
        renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
    });

});

我收到一条错误消息:TypeError: array[i].call is not a function
并指向three.js库的第7484行.
我已经使用了three.js库:

I am getting an error that says : TypeError: array[i].call is not a function
and is pointing to line 7484 of three.js library.
I have included the three.js library using:

<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r73/three.js"></script>

如您所见，它是 v73，我还没有触及代码.可能是什么问题?

So as you can see, its the v73 and I haven't touched the code. What could be the problem?

只有在点击屏幕然后拖动鼠标指针后才会出现错误，所以它一定与那段代码有关.

The error only comes after screen is clicked and then mouse pointer is dragged, so it must have got to do with that piece of code.

推荐答案

假设您希望在 OrbitControls 发送更改事件时渲染场景，则必须将代码更改为:

Assuming that you want the scene to render when OrbitControls sends a change event, you'll have to change the code to:

controls.addEventListener( 'change', render );
.
.
.
function render() {
    renderer.render( scene, camera );
}
renderer.render( scene, camera );

这篇关于类型错误:array[i].call 不是函数错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！