Hi all. I have noticed a bug(?) below. if i import some (any kind) skinned model with skeleton in .babylon format there is no issue at all, but if i use the gltf importer my model with skeleton gets kinda (very) messed up as you can see the attached picture. The issue exists only if i try to render some 2d elements with pixi.js alongside with babylon.js.
very basic sample code:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
html,
body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
canvas {
background-color: #999;
width: 800px;
height: 600px;
touch-action: none;
}
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pixi.js/4.5.1/pixi.min.js"></script>
<script src="https://preview.babylonjs.com/babylon.js"></script>
<script src="https://preview.babylonjs.com/loaders/babylonjs.loaders.min.js"></script>
</head>
<body>
<script>
const app = new PIXI.Application({
antialias: true,
transparent: true,
width: 800,
height: 600
});
document.body.appendChild(app.view);
const graphics = new PIXI.Graphics();
graphics.beginFill(0xDE3249);
graphics.drawRect(50, 50, 100, 100);
graphics.endFill();
app.stage.addChild(graphics);
const engine = new BABYLON.Engine(app.view, true);
const scene = new BABYLON.Scene(engine);
scene.createDefaultCameraOrLight();
BABYLON.SceneLoader.ShowLoadingScreen = false;
const loader = BABYLON.SceneLoader.Append(
"",
"model.gltf",
scene,
(scene) => {
let camera = new BABYLON.UniversalCamera("UniversalCamera", new BABYLON.Vector3(0, 0, -500), scene);
scene.setActiveCameraByID("UniversalCamera");
}
);
engine.runRenderLoop(function() {
if (engine.webGLVersion === 1) {
app.renderer.reset();
}
scene.autoClear = false;
scene.render();
engine.wipeCaches(true);
app.renderer.reset();
});
</script>