THREE.JS细节层次纹理加载

下面是包含三个.LOD（）对象的小Three.JS草图。 正如你所看到的，有4个层次有着独特的纹理

现在，所有这些纹理都在开始时预加载

有没有办法在放大时动态加载1、2、3级纹理

是的，我可以在没有THREE.LOD（）的情况下做同样的事情，只需编写我自己的自定义算法，这将在缩放时生成/删除平面，但我对内置THREE.LOD（）非常感兴趣

var文件夹=”http://vault.vkuchinov.co.uk/test/assets";
变量级别=[0xF25E6B、0x4EA6A6、0x8FD9D1、0xF2B29B、0xF28E85]；
var渲染器、场景、摄影机、控件、加载程序、lod、glsl、制服；
renderer=new THREE.WebGLRenderer({
反别名：对
});
renderer.setPixelRatio（window.devicePixelRatio）；
renderer.setSize（window.innerWidth、window.innerHeight）；
renderer.setClearColor（0x000000）；
document.body.appendChild（renderer.doElement）；
场景=新的三个。场景（）；
loader=新的三个.TextureLoader（）；
loader.crossOrigin=“”；
摄像头=新的三个透视摄像头（50，window.innerWidth/window.innerHeight，151200）；
摄像机位置设置（-20482048，-2048）；
控件=新的三个.轨道控件（摄影机、渲染器.doElement）；
controls.enableDamping=true；
控制。阻尼系数=0.05；
controls.screenSpacePanning=false；
控件。minDistance=8；
controls.maxDistance=5120；
controls.maxPolarAngle=Math.PI/2；
lod=新的三个。lod（）；
lod.name=“0,0”；
发电机（lod，2048，2048，2048，0，0x00FFFF）；
场景。添加（lod）；
制作动画（）；
函数animate（）{
控件更新（）；
渲染器。渲染（场景、摄影机）；
请求动画帧（动画）；
}
函数生成器（父级、宽度、高度、缩放、级别、十六进制）{
var id=parent.name.split（“，”）；
变量颜色=[0xFFFF00、0xFF000、0x00FF00、0x0000FF、0xFF00FF、0xF0F0]；
var group=new THREE.group（），几何体，平面；
var dx=0，dy=0；
dy*=数学功率（2级）；dx*=数学功率（2级）；
var url=folder+“/textures/level”+level+“/”+id[0]+“+id[1]+”.jpg”；
如果（级别<3）{
变量={
卫星：{
类型：“t”，
值：loader.load（url）
}
};
var glsl=新的三点材质({
制服：制服，
vertexShader:document.getElementById（“vertexTerrain”）.textContent，
fragmentShader:document.getElementById（“fragmentTerrain”）.textContent，
灯光：错误，
雾：错，
透明：正确
});
glsl.extensions.derivatives=true；
几何图形=新的三个平面几何图形（宽度、高度、256、256）；
平面=新的三点网格（几何体，glsl）；
平面旋转设置（-Math.PI/2,0,0）；
父级添加级别（平面、缩放）；
几何图形=新的三个平面几何图形（宽度、高度、高度）；
var ix=（编号（id[0]）*2）；
var iy=（编号（id[1]）*2）；
var lod1=new THREE.LOD（）；
var url1=getURL（ix+“，“+iy，宽度2，高度2，缩放2，级别1）；
变量uniforms1={
卫星：{
类型：“t”，
值：loader.load（url1）
}
};
var glsl1=新的三点着色器材质({
制服：制服1，
vertexShader:document.getElementById（“vertexTerrain”）.textContent，
fragmentShader:document.getElementById（“fragmentTerrain”）.textContent，
灯光：错误，
雾：错，
透明：正确
});
glsl1.extensions.derivatives=true；
平面=新的三个网格（几何体，glsl1）；
平面旋转设置（-Math.PI/2,0,0）；
lod1.添加级别（平面、缩放/2）；
lod1.位置.设置（-width\u4，0，-height\u4）；
lod1.name=ix+“，”+iy；
添加组（lod1）；
var lod2=新的三个.LOD（）；
var url2=getURL（ix+“，”+（iy+1），宽度为2，高度为2，缩放为2，级别为1）；
变量uniforms2={
卫星：{
类型：“t”，
值：loader.load（url2）
}
};
var glsl2=新的三点着色器材质({
制服：制服2，
vertexShader:document.getElementById（“vertexTerrain”）.textContent，
fragmentShader:document.getElementById（“fragmentTerrain”）.textContent，
灯光：错误，
雾：错，
透明：正确
});
glsl2.extensions.derivatives=true；
平面=新的三个网格（几何体，glsl2）；
平面旋转设置（-Math.PI/2,0,0）；
lod2.添加级别（平面、缩放/2）；
lod2.位置.设置（宽度\ 4，0，-高度\ 4）；
lod2.name=ix+“，”+（iy+1）；
添加组（lod2）；
var lod3=新的三个.LOD（）；
var url3=getURL（（ix+1）+“，“+iy，宽度2，高度2，缩放2，级别1）；
变量uniforms3={
卫星：{
类型：“t”，
值：loader.load（url3）
}
};
var glsl3=新的三点着色器材质({
制服：制服3，
vertexShader:document.getElementById（“vertexTerrain”）.textContent，
fragmentShader:document.getElementById（“fragmentTerrain”）.textContent，
灯光：错误，
雾：错，
透明：正确
});
glsl3.extensions.derivatives=true；
平面=新的三个网格（几何体，glsl3）；
平面旋转设置（-Math.PI/2,0,0）；
lod3.addLevel（平面、缩放/2）；
lod3.位置.设置（-width\u4，0，height\u4）；
lod3.name=（ix+1）+“，”+iy；
添加组（lod3）；
var lod4=新的三个.LOD（）；
var url4=getURL（（ix+1）+“，”+（iy+1）、宽度\ 2、高度\ 2、缩放\ 2、级别\ 1）；
变量uniforms4={