Javascript Three.js中Json格式几何体的线框

我想使用下面的Three.js代码以Json格式显示由顶点定义的平行六面体的线框

var testCube ={
                "metadata":{
                "version":json['version'],
                "type":json['type'],
                "uvs":json['n_uvs'],
                "normals":json['n_normals'],
                "faces":json['n_faces'],
                "generator":"io_three",
                "vertices":json['n_vertices'],
                                            },
                "faces":json['faces'],
                "vertices":json['vertices'],
                "normals":json['normals'],
                "uvs":[],
                "name":json['name']}

var loader = new THREE.JSONLoader();

var model = loader.parse( testCube );

meshBox = new THREE.Mesh( model.geometry, model.materials[ 0 ] );

var geo = new THREE.EdgesGeometry( meshBox.geometry );

var mat = new THREE.LineBasicMaterial( { color: 0xffffff, linewidth: 2 });

var wireframe = new THREE.LineSegments( geo, mat );

scene.add( wireframe );

但是，上面的代码会产生这种可视化效果：

我想制作一个可视化，其中内部线框也可见，如下所示：

问题：您知道如何修改上述Three.js代码以生成第二张图片中显示的完整线框吗

Upadate：使用函数

WireframeGeometry

可以绘制以下曲线图：

对角线显示在网格的每个面上。你知道一个不产生对角线的函数吗

---

非常感谢你的帮助

解决方案粗糙且不完善，这是一个需要改进和优化的巨大领域

创建一个几何图形，并在长方体相对侧的

THREE.LineSegments（）

的两个实例之间共享它

var scene=new THREE.scene（）；
var摄像机=新的三透视摄像机（60，window.innerWidth/window.innerHeight，11000）；
相机。位置。设置（-15，10，10）；
var renderer=new THREE.WebGLRenderer（{antialas:true}）；
renderer.setSize（window.innerWidth、window.innerHeight）；
document.body.appendChild（renderer.doElement）；
var controls=新的三个.OrbitControls（摄影机、渲染器.doElement）；
添加（新的三个环境光（0xffffff.5））；
var灯光=新的三方向灯光（0xffffff，.5）；
灯。位置。设置刻度（10）；
场景。添加（灯光）；
var-box=new THREE.Mesh（new THREE.BoxGeometry（10,5,5,5,5），new THREE.MeshLambertMaterial（{color:“gray”}））；
场景。添加（框）；
var材料=新的三线基本材料({
顶点颜色：三。顶点颜色
});
var params=box.geometry.parameters；
var geometryGridXY=栅格（参数宽度、参数高度、参数宽度线段、参数高度线段，“黄色”）；
var gridXYFront=新的三条线段（几何体，材质）；
gridXYFront.position.z=参数深度/2+0.001；
框。添加（gridXYFront）；
var gridXYBack=新的三条线段（几何体，材质）；
gridXYBack.position.z=-params.depth/2-0.001；
添加（gridXYBack）；
var geometryGridYZ=栅格（参数高度、参数深度、参数高度分段、参数深度分段，“aqua”）；
var gridYZLeft=新的三条线段（geometryGridYZ，材质）；
gridYZLeft.position.x=-params.width/2-0.001；
gridYZLeft.rotation.y=-Math.PI*.5；
框。添加（左侧）；
render（）；
函数render（）{
请求动画帧（渲染）；
渲染器。渲染（场景、摄影机）；
}

正文{
溢出：隐藏；
保证金：0；
}

功能网格（宽度、高度、宽度段、高度段、颜色）{
宽度=宽度| | 1；
高度=高度| | 1；
宽度段=宽度段| | 1；
高度分段=高度分段| | 1；
颜色=新的三种颜色（颜色！==未定义？颜色：0x444444）；
var stepWidth=宽度/宽度段；
var stepHeight=高度/高度段；
var halfWidth=宽度/2；
var半高=高度/2；
变量顶点=[]，
颜色=[]，j=0；
for（设i=0，k=-halfHeight；i取决于您想要的结果。作为一个选项，如果您知道框的大小和线段的数量，那么您可以构建6个网格，其中
3个.LineSegments（）
（框的每侧一个）。您好，谢谢您的回答，我还想显示内部线框。换句话说，如果您删除实体表面，内部段是可见的。谢谢。尝试用
线框几何体
替换
边几何体
。抱歉，不可以。您必须自己编写该代码…另外，请使用@username，否则用户可能无法访问通知。@Sim81您可以为三条边创建三个几何图形，并在属于相反边的
THREE.LineSegments（）
对之间共享它们。作为基础，您可以使用的源代码进行一些更改。但这再次取决于您想要的结果。谢谢您，伙计，我会努力的。我想我给了您赏金。