Ammo Debug Draw

LeXXik · December 6, 2020, 6:03pm

Made a little class that helps to draw the Ammo physics world for debugging.
Also shows how to use PCUI.

https://playcanvas.com/project/744419/overview/ammo-debug-draw

Gamer_Wael · December 7, 2020, 6:19am

Thanks a lot for making this!

This could be really useful for people who don’t use the editor.

kungfooman · February 17, 2021, 3:48pm

Super nice code and fun to play with!

I turned this all into a standalone repo for testing/comparing the same functionality in ES5 and ES6:

ES5:

github.com

kungfooman/playcanvas-test-es/blob/master/es5/es5.js

var canvas;
var app;
var scriptPreloader;
var camera;
var box;
var light;
var trigger;
var box1;
var box2;
var box3;
var cube;
var example;
var exampleScript;
var orbitCamera;
var keyboardInput;
var mouseInput;
var uiEntity;
var uiScript;
var uiAsset;
var uiAssetProfile;

This file has been truncated. show original

ES6:

github.com

kungfooman/playcanvas-test-es/blob/master/es6/es6.js

import pc from "./pc.js";
import "../pcui/pcui.js";
import {load_ammo} from "./load_ammo.js";
import {load_helipad} from "./load_helipad.js";

export let canvas;
export let app;
export let scriptPreloader;
export let camera;
export let box;
export let light;
export let trigger;
export let box1;
export let box2;
export let box3;
export let cube;
export let example;
export let exampleScript;
export let orbitCamera;
export let keyboardInput;

This file has been truncated. show original

ES6 demo is not fully ES6 tho, e.g. PCUI has no official ES6 build yet, so its mixed ES5/ES6, waiting for this:

kungfooman · March 1, 2021, 8:18am

As this is like one of the only examples I know which demonstrates non-trivial use of PCUI, I wonder how “correct” it is as a role model:

Is this the code PCUI wants to encourage:

content.dom.appendChild(input.dom);

This feels kinda overly complicated to me and should be rather this?

content.append(input);

mvaligursky · March 1, 2021, 8:57am

perhaps @Elliott has some thoughts on this?

kungfooman · March 7, 2021, 6:05am

I figured out yesterday that the Debug Draw Layer didn’t work as it used to work and @LeXXik updated the project now. Yet the update is introducing another bug, which I also have in my repo for drawing debug lines, which comes up when you scale the screen to a small width:

Anyone knows why this happens?

yaustar · March 7, 2021, 8:33am

Are the two cameras affected in the same way when resized? I don’t think the layer changes are the problem on this one.

Are you using the orbit camera script from the model viewer/tutorial? If so, this is set to true/false pending on the window size https://developer.playcanvas.com/en/api/pc.CameraComponent.html#horizontalFov

LeXXik · March 7, 2021, 8:43am

Thank you, @yaustar! Yes, the culprit was the orbit-camera script. This is fixed.

kungfooman · March 7, 2021, 9:53am

I think you fixed it by just commenting out fov code:

However, anyone has an idea what a nice solution would be considering the _checkAspectRatio method is actually useful? Maybe OrbitCamera should have a child cameras attribute for the case of having debug layers and iterate over all those cameras.

Or the file could contain an AspectRatioCheck script which could be attached to main and debug camera at the same time.

LeXXik · March 7, 2021, 12:14pm

Yep, it was enough for the purposes of the sample project. That orbit camera script is not related to Ammo Debug Draw, so it was enough to simply comment it out in this example, as it fits the purpose.

As for the orbit script, not sure what would be the best way to handle this. Adding a children scan may work, but then it adds an overhead as it is run each frame. Perhaps it could be acceptable, considering the script already adds some.

yaustar · March 7, 2021, 12:24pm

I would probably update the children but only when there’s a value change to the FOV property on the main camera. Or change it so that the debug camera matches the settings of it’s parent and has listeners for the properties? Either way it’s pretty tricky to keep track

What was the issue on having all the layers on the same camera?

LeXXik · March 7, 2021, 12:38pm

The lines were occluded by the objects, regardless of where the debug layer is in the layers composition. Having a second camera makes them render on top of everything.

yaustar · March 7, 2021, 1:07pm

I wonder if you can use the same layer as the renderLine as I believe that renders on top of everything?

LeXXik · March 7, 2021, 2:19pm

Ah, checked the renderLine sources, it sets the depth test to true by default. That was the reason the lines were occluded. Fixed.

Chenges:

Use a single camera for all layers
Revert changes made to orbit camera