コードをThree.JSの最新リリースに移行する際に問題が発生しました。すでにたくさん試しましたが、モデルが黒く見え続け（カラー関数が壊れているようです））、テクスチャをモデルにロードしようとするとすぐにクラッシュします。r52からr53への移行でテクスチャに関していくつかの変更があったことは知っていますが、正しく実装できないようです。JSONモデルをキャッシュするために動的ローディングシステムを使用しています。
現在、コードは次のようになっています。
var MB = MB || {};
MB.Part = function () {
this.id = MB.ObjectCount++;
this.type = 'part';
this.name = '';
this.reference = undefined;
this.mesh = undefined;
this.colour = undefined;
this.texture = undefined;
this.Object3D = undefined;
this.parent = undefined;
this.visible = true;
this.position = new THREE.Vector3();
this.rotation = new THREE.Vector3();
MB.Objects[this.id] = this
};
MB.Part.prototype.load = function (reference, name, mesh, color, texture, position, rotation, visible, visible3D, callback) {
var context = this;
if (!position) position = new THREE.Vector3();
if (!rotation) rotation = new THREE.Vector3();
if (this.isGeometrySetup(mesh, texture)) {
this.insert(context, reference, name, mesh, color, texture, position, rotation, visible, visible3D);
if (callback) callback()
} else {
var loader = new THREE.JSONLoader(false);
loader.load(PATH + 'data/parts/json/' + mesh + '.js', function (geometry) {
context.setupGeometry(geometry, mesh, texture);
context.insert(context, reference, name, mesh, color, texture, position, rotation, visible, visible3D);
if (callback) callback()
})
}
};
MB.Part.prototype.insert = function (context, reference, name, mesh, color, texture, position, rotation, visible, visible3D) {
context.reference = reference;
context.mesh = mesh;
context.name = name;
if (color) context.colour = color;
if (texture) context.texture = texture;
context.visible = visible;
if (color) {
context.setupColour(color);
var Object3D = new THREE.Mesh(MB.Library.geometries[mesh], MB.Library.colours[color])
} else if (texture) {
var Object3D = new THREE.Mesh(MB.Library.geometries[texture], new THREE.MeshFaceMaterial())
}
context.Object3D = Object3D;
context.Object3D.doubleSided = true;
context.position.copy(position);
context.rotation.copy(rotation);
Object3D.Object = context;
Object3D.scale.set(SCALE, SCALE, SCALE);
Object3D.position.copy(context.position);
Object3D.rotation.copy(context.rotation);
Object3D.visible = visible3D;
MB.Object3Ds[Object3D.id] = Object3D
};
MB.Part.prototype.isGeometrySetup = function (mesh, texture) {
if (texture) {
if (!MB.Library.geometries[texture]) return false;
else return true
} else {
if (!MB.Library.geometries[mesh]) return false;
else return true
}
};
MB.Part.prototype.setupGeometry = function (geometry, mesh, texture) {
if (texture) {
if (!MB.Library.geometries[texture]) {
var file = this.loadTexture(PATH + 'data/parts/textures/' + texture + '.png');
MB.Library.geometries[texture] = geometry;
MB.Library.geometries[texture].materials[0].map = file;
MB.Library.geometries[texture].materials[0].wireframe = (RENDER === 'WIREFRAME') ? true : false
}
} else {
if (!MB.Library.geometries[mesh]) {
MB.Library.geometries[mesh] = geometry
}
}
};
MB.Part.prototype.loadTexture = function (url, mapping, callback) {
var image = new Image(),
texture = new THREE.Texture(image, mapping);
image.onload = function () {
texture.needsUpdate = true;
if (callback) callback(this)
};
image.crossOrigin = '';
image.src = url;
return texture
};
MB.Part.prototype.setupColour = function (colour) {
if (!MB.Library.colours[colour]) {
var materialColour = '0x' + COLOURS[colour].hex;
var materialOpacity = COLOURS[colour].opacity;
MB.Library.colours[colour] = new THREE.MeshPhongMaterial({
ambient: new THREE.Color(materialColour),
color: new THREE.Color(materialColour),
opacity: materialOpacity,
shininess: 100
});
MB.Library.colours[colour].wireframe = (RENDER === 'WIREFRAME') ? true : false;
MB.Library.colours[colour].transparent = (COLOURS[colour].opacity < 1) ? true : false
}
};
MB.Part.prototype.setColour = function (colour) {
if (this.colour) {
this.setupColour(colour);
this.colour = colour;
this.Object3D.material = MB.Library.colours[colour]
}
};
MB.ObjectCount = 0;
MB.Object3Ds = {};
MB.Objects = {};
MB.Library = {
'colours': {},
'geometries': {}
};
問題はここにあるようです：
if (texture) {
if (!MB.Library.geometries[texture]) {
var file = this.loadTexture(PATH + 'data/parts/textures/' + texture + '.png');
MB.Library.geometries[texture] = geometry;
MB.Library.geometries[texture].materials[0].map = file;
MB.Library.geometries[texture].materials[0].wireframe = (RENDER === 'WIREFRAME') ? true : false
}
全体的に見て、私はまだテクスチャを処理しています。
どんな助けでも大歓迎です！
トーマス