2016-09-05 41 views
0

mapboxとthree.jsを使用して非アクティブマップを作成しました。 そしてマップをドラッグすると、マップボックス上のレイヤーであるthree.jsシーンにオブジェクトをドラッグアンドドロップすることもできます。 http://test3.stdmed.ru 私は問題があります:私がドラッグを開始すると、three.jsシーンのオブジェクトは自動的にカーソル位置に置かれますが、これは正確ではありません。この効果はジオポジションを破壊するためです。オブジェクトがドラッグ中にカーソルを移動する(EventsControls + three.js)

この例では、次のような単純な効果があります。http://alexan0308.github.io/threejs/examples/#controls_events_example カーソルを中央に置くと、カーソルが中央に配置されます。しかし、私はそれをこの効果なしでドラッグする必要があります。ここで

は私のコードは、マップ上で使用されます。

EventsControls2 = new EventsControls(camera, renderer.domElement); 
EventsControls2.attach(plane); 

EventsControls2.attachEvent('mouseOver', function() { 

    controls.enabled = false; 
    controls.target0.copy(controls.target); 

}); 

EventsControls2.attachEvent('mouseOut', function() { 

    controls.reset(); 
    controls.target.copy(controls.target0); 
    controls.object.position.copy(controls.position0); 
    controls.update(); 
    controls.enabled = true; 

}); 

EventsControls = new EventsControls(camera, renderer.domElement); 
EventsControls.map = plane; 

EventsControls.attachEvent('mouseOver', function() { 

    this.container.style.cursor = 'pointer'; 

}); 

EventsControls.attachEvent('mouseOut', function() { 

    this.container.style.cursor = 'auto'; 

}); 

EventsControls.attachEvent('dragAndDrop', function() { 

    this.container.style.cursor = 'move'; 
    //this.focused.position.y = this.previous.y; 
    //this.focused.position.x = this.previous.x; 


}); 

EventsControls.attachEvent('onclick', function() { 

    controls.enabled = false; 

});   

EventsControls.attachEvent('mouseUp', function() { 

    this.container.style.cursor = 'auto'; 

}); 

答えて

0
EventsControls = new EventsControls(camera, renderer.domElement); 
EventsControls.map = plane; 
EventsControls.offsetUse = true; 

EventsControls.offsetUse =はtrue。 < < < < < < < < <これは私が追加しなければならないものです!

関連する問題