I load gltf model,It show the following information:
Require extension KHR_materials_common is not available
How to solve it?
It seems your glTF model is a 1.0 version, as KHR_materials_common
is for 1.0: https://github.com/KhronosGroup/glTF/tree/master/extensions/1.0/Khronos/KHR_materials_common
We normally do support this extension, so you may need to provide a playground so that we can have a look. However, you really should upgrade your model to glTF 2.0, it’s far superior and I think glTF 1.0 is rather deprecated now.
Also adding @bghgary in case I missed something.
1 Like
Thanks,this is my code
(Attachment glTF-MaterialsCommon.rar is missing)
my code as follow:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Babylon Template</title>
<style>
html, body {
overflow: hidden;
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
#renderCanvas {
width: 100%;
height: 100%;
touch-action: none;
}
</style>
<!--<script src="../js/babylon.js"></script>
<script src="../js/babylonjs.loaders.min.js"></script>
<script src="../js/babylonjs.materials.min.js"></script>-->
<script src="https://preview.cnbabylon.com/babylon.js"></script>
<script src="https://preview.cnbabylon.com/materialsLibrary/babylonjs.materials.min.js"></script>
<script src="https://preview.cnbabylon.com/loaders/babylonjs.loaders.min.js"></script>
<script src="https://preview.cnbabylon.com/postProcessesLibrary/babylonjs.postProcess.min.js"></script>
<script src="https://preview.cnbabylon.com/proceduralTexturesLibrary/babylonjs.proceduralTextures.min.js"></script>
<script src="https://preview.cnbabylon.com/serializers/babylonjs.serializers.min.js"></script>
<script src="https://preview.cnbabylon.com/gui/babylon.gui.min.js"></script>
<script src="https://preview.cnbabylon.com/inspector/babylon.inspector.bundle.js"></script>
</head>
<body>
<canvas id="renderCanvas" touch-action="none"></canvas> <!--touch-action="none" for best results from PEP-->
<script>
var canvas = document.getElementById("renderCanvas"); /*得到canvas对象的引用*/
var engine = new BABYLON.Engine(canvas, true); /*初始化 BABYLON 3D engine*/
/*Add the create scene function*/
var createScene = function () {
var scene = new BABYLON.Scene(engine); /*创建一个场景scene*/
var camera = new BABYLON.ArcRotateCamera("Camera", Math.PI / 2, Math.PI / 2, 100, new BABYLON.Vector3(0,0,5), scene);
var light = new BABYLON.HemisphericLight("light", new BABYLON.Vector3(0, -1, 0), scene); // 半球光,从上向下打光
scene.activeCamera.panningSensibility = 10 // 鼠标平移灵敏度
camera.attachControl(canvas, true);
/*Append glTF model to scene*/
var knot01 = BABYLON.SceneLoader.ImportMesh("", "http://192.168.1.104:8007/model/gltf/glTF-MaterialsCommon/", "GearboxAssy.gltf", scene, function (newMeshes) {
// Set the target of the camera to the first imported mesh
/*for (let i = 0; i < newMeshes.length; i++) {
newMeshes[i].scaling = new BABYLON.Vector3(0.1, 0.1, 0.1)
}*/
});
return scene;
};
/*End of the create scene function*/
var scene = createScene(); /*Call the createScene function*/
/*最后一步调用engine的runRenderLoop方案,执行scene.render(),让我们的3d场景渲染起来*/
engine.runRenderLoop(function () {
scene.render();
});
/*监听浏览器改变大小的事件,通过调用engine.resize()来自适应窗口大小*/
window.addEventListener("resize", function () {
engine.resize();
});
</script>
</body>
</html>
Here is a playground that works with materials common:
https://playground.babylonjs.com/#AH4LRK#3
As @Evgeni_Popov says, this is a glTF 1.0 model. Please don’t use this if you don’t have to. Use glTF 2.0.
1 Like