卜若的代码笔记-webgl系列-第八章：交互，racast初步

1.将绝对坐标和webgl坐标进行变换

2 使用raycast

3 Control Demo:

 

    //用来保存鼠标坐标信息

    var mouse = new THREE.Vector2();
    //添加鼠标移动事件，检测鼠标的移动
    document.addEventListener('mousemove', onDocumentMouseMove, false);

    function onDocumentMouseMove(event) {

        //获取鼠标的x，y坐标

        mouse.x = (event.clientX / 800) * 2 - 1;
        mouse.y = -((event.clientY-100) /800) * 2 + 1;
        console.info("move"+ mouse.x+"<>"+ mouse.y+"<>"+event.clientX+"<>"+event.clientY);

        return mouse;
    }

    div.onmousemove = onDocumentMouseMove;
    //----------

    var raycaster = new THREE.Raycaster();
    div.onclick = function(){
        raycaster.setFromCamera(mouse, opView.camera);
        var intersects = raycaster.intersectObjects(opView.scene.children);

        if (intersects.length>0)
        {
            intersects[ 0].object.material.color.set( 0x000000 );
            select(intersects[0].object);
        }

    }