我是 Scenejs 的新手,有以下问题。我从查询中得到 30 到 50 张缩略图。图像的宽度约为 200 像素,高度为 100 像素到 300 像素。我想将每个缩略图图像作为纹理呈现在 3d 场景中排列的单独矩形棱镜上。我研究的许多示例仅显示立方体和均匀的正方形图像。当我尝试调整矩形棱镜的几何形状时,图像会出现多次。下面给出的代码摘录。有人能指出我正确的方向吗?
function get_Json_test_data()
{
var wiki_node_top =[{
type: "cameras/orbit",
yaw: 0,
pitch: 0,
zoom: 10,
zoomSensitivity:0.5,
nodes: [
{
type: "material",
id: "myMaterial",
color: { r: 1, g: 1, b: 1.0 }
}
]
}];
scene = SceneJS.createScene({
nodes: wiki_node_top
});
}
function add_node_wiki (json1)
{
var wiki_x=-4;
var wiki_y=-4;
var wiki_z=0;
var test1 = json1.query.pages;
var test2 = [];
var icount = 0;
$.each(test1, function (i, item) {
test2[icount] = item;
icount++;
});
$.each(test2, function (i, item) {
var wiki_x_size=item.imageinfo[0].thumbwidth/200;
var wiki_y_size=item.imageinfo[0].thumbheight/200;
wiki_x +=2*wiki_x_size;
wiki_y += 2*wiki_y_size;
update_scene(item, wiki_x,wiki_y,wiki_z,wiki_x_size,wiki_y_size);
});
}
function update_scene(item, wiki_x,wiki_y,wiki_z,wiki_x_size,wiki_y_size)
{
scene.getNode("myMaterial",
function(myMaterial) {
myMaterial.addNode({
type: "texture",
src: item.imageinfo[0].thumburl,
wrapS: "ClampToEdgeWrapping",
wrapT: "ClampToEdgeWrapping",
nodes:[{
type: "translate",
x: wiki_x,
y: wiki_y,
z: wiki_z,
nodes: [{
type: "geometry/box",
xSize: wiki_x_size,
ySize: wiki_y_size,
zSize: 1
}]
}]
});
})
}