2017-08-27 728 views
0

不久前,我开始在巴比伦,我正在寻找一些方法来查找鼠标在画布上点击时的坐标。我能够很容易地找到一个给定的对象,但不是现场本身(!?)我不知道什么可能是错的,它似乎很愚蠢,但我还没有找到解决方案...如何在Babylon.js场景中找到点击的坐标?

window.addEventListener('DOMContentLoaded', function() { 
 
    var canvas = document.getElementById('canvas'); 
 
    var engine = new BABYLON.Engine(canvas, true); 
 
      
 
    var createScene = function() { 
 
     var scene = new BABYLON.Scene(engine); 
 
     scene.clearColor = new BABYLON.Color3.White(); 
 

 
     var box = BABYLON.Mesh.CreateBox("Box",4.0,scene); 
 
     var camera = new BABYLON.ArcRotateCamera("arcCam", 
 
        BABYLON.Tools.ToRadians(45), 
 
        BABYLON.Tools.ToRadians(45), 
 
        10.0,box.position,scene); 
 
        camera.attachControl(canvas,true); 
 

 
     var light = new BABYLON.PointLight("pointLight",new BABYLON.Vector3(
 
      0,10,0),scene); 
 
     light.diffuse = new BABYLON.Color3(1,1,1); 
 

 
     var onpickAction = new BABYLON.ExecuteCodeAction(
 
     BABYLON.ActionManager.OnPickTrigger, 
 
     function(evt) { 
 
      console.log("(",evt.pointerX,",",evt.pointerY,")"); 
 
     }); 
 

 
     //doesn't work (???) 
 
     scene.actionManager = new BABYLON.ActionManager(scene); 
 
     scene.actionManager.registerAction(onpickAction); 
 

 
     //works fine 
 
     box.actionManager = new BABYLON.ActionManager(scene); 
 
     box.actionManager.registerAction(onpickAction); 
 

 
     return scene; 
 
    } 
 

 
    var scene = createScene(); 
 
    engine.runRenderLoop(function() { 
 
     scene.render(); 
 
    }); 
 
});
<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>Title</title> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babylonjs/2.5.0/babylon.js"></script> 
 
    <style> 
 
     #canvas { 
 
      width: 100%; 
 
      height: 100%; 
 
     } 
 
    </style> 
 
</head> 
 
<body> 
 
    <canvas id="canvas"></canvas> 
 
</body> 
 
</html>

回答