三个JS-未捕获类型错误：无法读取属性'；长度'；在THREE.JSONLoader.parse处未定义的
我正试图呈现一个混合器导出的json（导出到三个js中使用）。我是这样做的三个JS-未捕获类型错误：无法读取属性'；长度'；在THREE.JSONLoader.parse处未定义的,three.js,Three.js,我正试图呈现一个混合器导出的json（导出到三个js中使用）。我是这样做的 <!DOCTYPE html> <head> <meta charset="UTF-8"> <title>Three.js JSON Loader Demo</title> <script type="text/javascript" src="three.min.js"></script>
<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>Three.js JSON Loader Demo</title>
<script type="text/javascript" src="three.min.js"></script>
<script type="text/javascript">
var renderer; // A three.js WebGL or Canvas renderer.
var scene; // The 3D scene that will be rendered, containing the model.
var camera; // The camera that takes the picture of the scene.
var light; // A light shining from the direction of the camera.
var model; // The three.js object that represents the model.
var rotateX = 0; // rotation of model about the x-axis
var rotateY = 0; // rotation of model about the y-axis
function modelLoadedCallback(geometry, materials) {
var object = new THREE.Mesh(geometry, new THREE.MeshFaceMaterial(materials));
/* Determine the ranges of x, y, and z in the vertices of the geometry. */
var xmin = Infinity;
var xmax = -Infinity;
var ymin = Infinity;
var ymax = -Infinity;
var zmin = Infinity;
var zmax = -Infinity;
for (var i = 0; i < geometry.vertices.length; i++) {
var v = geometry.vertices[i];
if (v.x < xmin)
xmin = v.x;
else if (v.x > xmax)
xmax = v.x;
if (v.y < ymin)
ymin = v.y;
else if (v.y > ymax)
ymax = v.y;
if (v.z < zmin)
zmin = v.z;
else if (v.z > zmax)
zmax = v.z;
}
/* translate the center of the object to the origin */
var centerX = (xmin+xmax)/2;
var centerY = (ymin+ymax)/2;
var centerZ = (zmin+zmax)/2;
var max = Math.max(centerX - xmin, xmax - centerX);
max = Math.max(max, Math.max(centerY - ymin, ymax - centerY) );
max = Math.max(max, Math.max(centerZ - zmin, zmax - centerZ) );
var scale = 10/max;
object.position.set( -centerX, -centerY, -centerZ );
console.log("Loading finished, scaling object by " + scale);
console.log("Center at ( " + centerX + ", " + centerY + ", " + centerZ + " )");
/* Create the wrapper, model, to scale and rotate the object. */
model = new THREE.Object3D();
model.add(object);
model.scale.set(scale,scale,scale);
rotateX = rotateY = 0;
scene.add(model);
render();
}
function render() {
renderer.render(scene, camera);
}
function init() {
try {
var theCanvas = document.getElementById("cnvs");
scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera(50, theCanvas.width/theCanvas.height, 0.1, 100);
camera.position.z = 30;
light = new THREE.DirectionalLight();
light.position.set(0,0,1);
renderer = new THREE.WebGLRenderer( {
canvas: theCanvas,
antialias: true
} );
scene.add(light);
render();
var loader = new THREE.JSONLoader();
loader.load("DummyBox.js", modelLoadedCallback);
}
catch (e) {
document.getElementById("message").innerHTML = "Sorry, an error occurred: " + e;
}
}
</script>
</head>
<body onload="init()" bgcolor="#CCC">
<noscript>
<p style="color: #A00; font-weight: bold">Sorry, but this page requires JavaScript!</p>
</noscript>
<div style="float:left">
<canvas width=350 height=400 id="cnvs" style="background-color:black"></canvas>
</div>
</body>
</html>
var materials = new THREE.MeshLambertMaterial({color:0xff0000});
你用的是哪一个版本的THREE.js？我想我应该用BufferGeometryLoader。但如果出现此错误，则找不到构造函数THREE.BufferGeometryLoaderCorrect，
THREE.JSONLoaderTHREE.BUfferGeometryLoadervar loader = new THREE.BufferGeometryLoader(); //new THREE.JSONLoader();
var geometry = new THREE.Geometry().fromBufferGeometry(geometry);
var materials = new THREE.MeshLambertMaterial({color:0xff0000});