Three.js地球旋转点击

时间:2013-02-10 15:03:24

标签: three.js webgl

我创建了一个旋转地球仪,它有一个主机点,可以在点击时触发模态。我希望地球旋转并点击屏幕中心的热点。下面的代码会旋转地球,但不会根据需要居中。请提供指示

 checkHotspotClick: function(){
        var me = this;
        window.cancelAnimationFrame(me.animate)
        //get normalized mousecoords -1 -> 1
        var mouse2DX = (mouseX/me.windowDimensionX)*2-1
        var mouse2DY = -(mouseY/me.windowDimensionY)*2+1

        //for use with a orthographic camera
        var vecOrigin = new THREE.Vector3( mouse2DX, mouse2DY, - 1 );
        var vecTarget = new THREE.Vector3( mouse2DX, mouse2DY, 1 );

        me.projector.unprojectVector( vecOrigin, me.camera );
        me.projector.unprojectVector( vecTarget, me.camera );
        vecTarget.subSelf( vecOrigin ).normalize();

        var ray = new THREE.Ray();
        ray.origin = vecOrigin;
        ray.direction = vecTarget;
        var intersects = ray.intersectObjects(me.hotspotsArr);

        if (intersects.length > 0) {
            console.log($(me.hotspotDivsArr[intersects[0].object.name]).html())
            // ajax overide
            me.targetRotation_x += (me.options.camX-mouse2DX)*12;
            me.targetRotation_y += (me.options.camY+mouse2DY)*12;
            me.doZoom(-6);
            console.log(me.targetRotation_x);
            var country_id = $(me.hotspotDivsArr[intersects[0].object.name]).data('id');
            url = 'home/getProjectData';
            $("#myModal").load(url,{ s: country_id });
            setTimeout(function() {$("#myModal").modal('show')},2000);
            $('#myCarousel').carousel($(this).data('slide-index'));
            /*me.targetRotation_x = 0;*/

            } 
            else
            {
                me.doZoom(+6);
            }
        },

0 个答案:

没有答案