Threejs实现3d地球记录（5）

四、球面标注

1、静态圆点平面mash标注地点

• 创建矩形平面网格模型（PlaneGeometry），并设置贴图（使用TextureLoader加载器），然后设置该网格模型所在位置,并渲染出来。

function createPointMesh(R, lon, lat) {
   
  var geometry1 = new THREE.PlaneGeometry(1, 1);
  var textureLoader1 = new THREE.TextureLoader();
  var texture1 = textureLoader1.load(tagImg);
  var material1 = new THREE.MeshBasicMaterial({
   
    color: 0x22ffcc,
    map: texture1,
    transparent: true,
    opacity: 1.0,
    side: THREE.DoubleSide,
    depthWrite: false,
  });

  var mesh = new THREE.Mesh(geometry1, material1);
  var size1 = R * 0.05;//矩形平面Mesh的尺寸
  mesh.scale.set(size1, size1, size1);//设置mesh大小
  
  // 经纬度转球面坐标
  var coord = lon2xyz(R * 1.001, lon, lat)
  //设置mesh位置
  mesh.position.set(coord.x, coord.y, coord.z);
  return mesh;
}

标注的点与飞线段起始点一致，因此可在渲染飞线处，渲染球面标注

var flyArcGroup = new THREE.Group();
var flyArr = [];
Object.keys(data)