three.js仅在南半球的面孔的背面

Question

我正在尝试根据地理空间数据集实现自己的球体。

我导入一个GeoJSON文件，该文件描述了覆盖整个地球的网格。每个网格单元（一个网格单元有3个以上的顶点！）的坐标以纬度（-90 90）和经度（-180 180）给出。这些极坐标转换为笛卡尔坐标x，y，z并发送给以下函数：

function triangulate_grid(vertices, color) {
  //http://blog.cjgammon.com/threejs-geometry
  var holes = [];
  var triangles, mesh;
  var geometry = new THREE.Geometry();
  var color = new THREE.Color(color[0], color[1], color[2]);
  //http://jsfiddle.net/RnFqz/22/
  var material = new THREE.MeshPhongMaterial({
    color: color,
    // FlatShading: THREE.FlatShading,
    // side: THREE.DoubleSide,
    // side: THREE.BackSide,
    side: THREE.FrontSide,
    wireframe: false,
    transparent: false,
    vertexColors: THREE.FaceColors, // CHANGED
    // overdraw: true
  });

  var materialIndex = 0; //optional
  geometry.vertices = vertices;

  triangles = THREE.ShapeUtils.triangulateShape(vertices, holes);

  for (var i = 0; i < triangles.length; i++) {
    face = new THREE.Face3(triangles[i][0], triangles[i][1], triangles[i][2])
    face.color = color;
    geometry.faces.push(face);

  }
  geometry.computeFaceNormals();
  geometry.computeVertexNormals();
  mesh = new THREE.Mesh(geometry, material);
  //https://stackoverflow.com/questions/28848863/threejs-how-to-rotate-around-objects-own-center-instead-of-world-center
  mesh.rotation.x = -90;
  scene.add(mesh)

}

绘制的球体如下所示：

更容易查看是否可以自己旋转它。但是发生的是，我看到的是宇航员（从上方）看到的北半球的表面，而只能通过观察地球才能看到南半球的表面。看起来赤道正在“翻转”纬度坐标为0到-90的面，只显示背面。

我正在使用此功能进行坐标转换。

//https://bl.ocks.org/mbostock/2b85250396c17a79155302f91ec21224
function vertex(point) {
  var lambda = (point[0]) * Math.PI / 180, // lon
    phi = (point[1]) * Math.PI / 180, //lat
    cosPhi = Math.cos(phi);
  var radius = 1;
  vector = new THREE.Vector3(
    radius * cosPhi * Math.cos(lambda),
    radius * cosPhi * Math.sin(lambda),
    radius * Math.sin(phi)
  );
  // vector.applyAxisAngle( 0, 90 );
  return vector
}

我使用过THREE.DoubleSide，但这只能部分解决问题。首先，我认为这是没有必要的，只需要使用资源，其次，赤道上仍然有人工痕迹。请参阅图像的左上角。

问题： 如何在北半球和南半球绘制所有面孔，以使我看到表面却看不到？

更新： 添加了一个立方体，使其更加清晰。