Question

我是Babylonjs的新手，我想使用BabylonJs显示/显示图像，我还希望使用键盘（如左箭头键，右箭头键，上箭头键和下箭头键）移动图像并进行碰撞检测我还想禁用所有鼠标事件。

我在下面写了代码来显示图像，但我认为这不是正确的方法..

  var playerMaterial = new BABYLON.StandardMaterial("ground", scene);
    playerMaterial.diffuseTexture = new BABYLON.Texture("/images/mail.png", scene);
    playerMaterial.specularColor = new BABYLON.Color3(0, 0, 0);
    player.material = playerMaterial;
    player.position.y = 1;
    player.position.x = -84;
    player.size = 20;

有人可以帮我怎么做（如果你可以分享可能更有帮助的源代码）？

感谢
拉维兰詹

Answer 1

假设您还拥有相机和光源，您的代码看起来基本正确。这是a playground entry。

而且，对于后代，这是代码：

var scene = new BABYLON.Scene(engine);

//Create a light
var light = new BABYLON.PointLight("Omni", new BABYLON.Vector3(-60, 60, 80), scene);

//Create an Arc Rotate Camera - aimed negative z this time
var camera = new BABYLON.ArcRotateCamera("Camera", Math.PI / 2, 1.0, 210, BABYLON.Vector3.Zero(), scene);
camera.attachControl(canvas, true);

//Creation of a repeated textured material
var materialPlane = new BABYLON.StandardMaterial("texturePlane", scene);
materialPlane.diffuseTexture = new BABYLON.Texture("textures/grass.jpg", scene);
materialPlane.specularColor = new BABYLON.Color3(0, 0, 0);
materialPlane.backFaceCulling = false;//Allways show the front and the back of an element

//Creation of a plane
var plane = BABYLON.Mesh.CreatePlane("plane", 120, scene);
plane.rotation.x = Math.PI / 2;
plane.material = materialPlane;

我从他们的一个演示开始，然后砍掉了大部分内容以获得最小的例子。我离开backFaceCulling = false（否则图片只能从一个方向看到），并添加到specularColor设置中。

另一种方法是将diffuseTexture替换为emissiveTexture：

materialPlane.emissiveTexture = new BABYLON.Texture("textures/grass.jpg", scene);

然后你可以注释出光线，它仍然可见。（事实上，如果你让灯光指向它，它就会曝光过度。）

（我建议您为键盘控制和碰撞检测问题开始一个新问题。或者通过巴比伦样本和教程视频进行处理。）

使用babylonjs显示图像

1 个答案: