从JSON文件中读取点数组

Stu*_*rey 2 javascript jquery json three.js

我无法从JSON文件中读取数据.我已经完成了其他阅读Stack Overflow上的JSON问题和JSON文档无济于事.

我正在尝试读取要在Three.js中显示的数据.以下代码段有效:

var obj = { "points" : [
{ "vertex":[0.0,0.0,0.0] },
{ "vertex":[200.0,0.0,0.0] },
{ "vertex":[-200.0,0.0,0.0] },
{ "vertex":[0.0,100.0,0.0] },
{ "vertex":[0.0,-100.0,0.0] },
{ "vertex":[0.0,0.0,300.0] },
{ "vertex":[0.0,0.0,-300.0] },
{ "vertex":[75.0,75.0,75.0] },
{ "vertex":[50.0,50.0,50.0] },
{ "vertex":[25.0,25.0,25.0] } ]};

var geometry = new THREE.Geometry();

for (var i=0;i<10;i++)
{
    var vertex = new THREE.Vector3();
    vertex.x = obj.points[i].vertex[0];
    vertex.y = obj.points[i].vertex[1];
    vertex.z = obj.points[i].vertex[2];
    geometry.vertices.push( vertex );
}
Run Code Online (Sandbox Code Playgroud)

它读取点并且点进一步向下渲染.我在index.html旁边有一个名为的文件

test.json

它包含以下内容:

{ "points" : [
{ "vertex":[0.0,0.0,0.0] },
{ "vertex":[200.0,0.0,0.0] },
{ "vertex":[-200.0,0.0,0.0] },
{ "vertex":[0.0,100.0,0.0] },
{ "vertex":[0.0,-100.0,0.0] },
{ "vertex":[0.0,0.0,300.0] },
{ "vertex":[0.0,0.0,-300.0] },
{ "vertex":[75.0,75.0,75.0] },
{ "vertex":[50.0,50.0,50.0] },
{ "vertex":[25.0,25.0,25.0] } 
]}
Run Code Online (Sandbox Code Playgroud)

我的问题是以下不起作用(即不显示点):

var geometry = new THREE.Geometry();

var obj2 = jQuery.getJSON('test.json');

for (var i=0;i<10;i++)
{
    var vertex = new THREE.Vector3();
    vertex.x = obj2.points[i].vertex[0];
    vertex.y = obj2.points[i].vertex[1];
    vertex.z = obj2.points[i].vertex[2];
    geometry.vertices.push( vertex );
}
Run Code Online (Sandbox Code Playgroud)

这些文件位于我的保管箱的公共文件夹中,并从公共链接查看,即使如此,以防万一我使用--allow-files-access-from-files标志运行chrome.

UPDATE

我的关键错误是没有处理getJSON函数回调中的顶点.我的第二个错误是假设在回调中将顶点添加到几何堆栈就足够了.实际上我必须从几何体创建对象并将其添加到场景中才能工作.非常感谢大家的帮助.

$.getJSON('test.json', function(obj2) {

    var geometry = new THREE.Geometry();

    for (var i=0;i<10;i++)
    {
        var vertex = new THREE.Vector3();
        vertex.x = obj2.points[i].vertex[0];
        vertex.y = obj2.points[i].vertex[1];
        vertex.z = obj2.points[i].vertex[2];
        geometry.vertices.push( vertex );
    }

    vc1 = geometry.vertices.length;

    object = new THREE.ParticleSystem( geometry, shaderMaterial );
    object.dynamic = true;

    var vertices = object.geometry.vertices;
    var values_size = attributes.size.value;
    var values_color = attributes.ca.value;

    for( var v = 0; v < vertices.length; v ++ ) {
    values_size[ v ] = 50;
    values_color[ v ] = new THREE.Color( 0xffffff );
    }

    scene.add( object );
});
Run Code Online (Sandbox Code Playgroud)

epa*_*llo 5

阅读getJSON的文档,这是一个异步调用!

您需要将for循环放入回调中.