<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<script src="https://preview.babylonjs.com/babylon.js"></script>
<script src="https://preview.babylonjs.com/loaders/babylonjs.loaders.js"></script>
</head>
<body>
<h1>Hello Plunker!</h1>
<main id="wrapper">
<canvas id="renderCanvas" width="400" height="400"></canvas>
</main>
<script src="script.js"></script>
</body>
</html>
const vrmLoaderScript = document.createElement('script');
vrmLoaderScript.src = 'https://cdn.jsdelivr.net/npm/babylon-vrm-loader/dist/index.js';
document.head.appendChild(vrmLoaderScript);
const canvas = document.getElementById('renderCanvas');
const engine = new BABYLON.Engine(canvas, true);
//const vrmManager = null;
var createScene = function() {
var scene = new BABYLON.Scene(engine);
var camera = new BABYLON.ArcRotateCamera("camera1", -Math.PI / 2, Math.PI / 2, 2, new BABYLON.Vector3(0, 1.3, 0), scene);
camera.attachControl(canvas, true);
var light = new BABYLON.DirectionalLight("light", new BABYLON.Vector3(0.3, -1, 0.3), scene);
var ground = BABYLON.MeshBuilder.CreateGround("ground", {
width: 6,
height: 6
}, scene);
vrmLoaderScript.onload = () => {
BABYLON.SceneLoader.Append('https://raw.githubusercontent.com/vrm-c/UniVRM/master/Tests/Models/Alicia_vrm-0.51/', 'AliciaSolid_vrm-0.51.vrm', scene, () => {
});
};
return scene;
};
const scene = createScene();
window.currentScene = scene;
engine.runRenderLoop(function() {
scene.render();
});
window.addEventListener('resize', function() {
engine.resize();
});
/* Styles go here */