具有不同纹理的多个体素.性能
Multiple Voxels with different texture. Performance
我需要在同一场景几何体中添加多个体素(立方体等于),但每个体素具有不同的纹理。
我的体素超过 500 个,在性能上存在严重错误。
这是我的代码:
texture = crearTextura(voxel.text,color,voxelSize);
material = new THREE.MeshBasicMaterial({ map: texture });
mesh = new THREE.Mesh(new THREE.CubeGeometry(voxelSize, voxelSize, voxelSize, 1, 1, 1,material),faceMaterial);
scene.add(mesh);
您需要将所有立方体批处理到单个几何图形中。
看看这个例子:http://mrdoob.github.com/three.js/examples/webgl_geometry_minecraft.html
最后,
我创建了一个与所有立方体的地理合并。
在此更改之前,我曾在立方体中单击鼠标来处理交叉点。
我尝试解决此问题,但没有用:
用于添加几何体合并和与所有网格的数组的代码:
var geometry = new THREE.Geometry();
for( var i = 0; i < voxels.length; i++ ){
var voxel = voxels[i];
color = voxel.color;
texture = textPlaneTexture(voxel.text,color,voxelSize);
material = new THREE.MeshBasicMaterial({ map: texture });
mesh = new THREE.Mesh(new THREE.CubeGeometry(voxelSize, voxelSize, voxelSize, 1, 1, 1, material));
mesh.name = voxel.name;
mesh.position.x = voxel.x * voxelSize + offset_x;
mesh.position.y = voxel.y * voxelSize + offset_y;
mesh.position.z = voxel.z * voxelSize + offset_z;
//
objects.push( mesh );
THREE.GeometryUtils.merge( geometry, mesh );
}
//Add geometry to scene
mesh = new THREE.Mesh( geometry, new THREE.MeshFaceMaterial() );
scene.add( mesh );
...
双击鼠标事件
function onDocumentMouseDoubleClick( event ) {
if (event.target instanceof HTMLCanvasElement) {
event.preventDefault();
mouse2D.x = ( event.clientX / widthChart ) * 2 - 1;
mouse2D.y = - ( (parseInt(event.clientY) - offset_mouse_y) / heightChart ) * 2 + 1;
mouse3D = projector.unprojectVector( mouse2D.clone(), camera );
ray.direction = mouse3D.subSelf( camera.position ).normalize();
var intersects = ray.intersectObjects( objects );
if ( intersects.length > 0 ) {
if ((intersects[ 0 ].object.name != 'undefined') && (intersects[ 0 ].object.name != '')) {
//Object clicked
};
};
};
};
相关文章:
- 函数参数中的数据与指定变量之间的任何性能差异
- 提高JQuery的性能
- 使用正则表达式评估电子邮件地址时出现性能问题
- React:按键的性能提升
- 在Three.js中导出网格会提高性能吗
- 在threejs中使用纹理网格和线框网格
- 在javascript中搜索项目列表的性能
- 为什么在许多浏览器中drawImage()的性能略好于createPattern()
- JavaScript数组优化以提高性能
- React+Redux性能优化与组件ShouldUpdate
- ThreeJS将画布中的文本渲染为纹理,然后应用于平面
- 在循环中附加事件处理程序时出现浏览器性能问题
- JavaScript-===vs===运算符性能
- 无法在obj+mtl文件中加载纹理
- 超时功能的性能
- 加载collada纹理数据(.jpg本身)时对其进行操作
- 具有不同纹理的多个体素.性能
- 三个js性能如何使使用图像纹理更快
- Webgl 动画纹理性能与画布绘制图像性能
- THREE js 更新纹理生成 Canvas 的最佳性能方式