异步并发生成标签 ​

/**
 * @description: 并发加载标签
 * @param {Array} urls 加载标签的数据
 * @param {Number} maxNum 最大并发数
 * @return {Object3D} 请求得到的数据
 */
export function concurRequest(tipsInfoList, maxNum) {
  return new Promise((resolve) => {
    if (tipsInfoList.length === 0) {
      /* 先考虑边界问题 */
      resolve([]);
      return;
    }
    const tipObj = new THREE.Object3D(); // 存储请求结果并返回
    tipObj.name = 'tipObj';
    let index = 0; // 下一个请求的下标
    let count = 0; // 当前完成的数量
    // 发送请求
    async function request() {
      if (index === tipsInfoList.length) {
        return;
      }
      const tipsInfo = tipsInfoList[index];
      index++;
      try {
        const resp = await createTipsInfo(tipsInfo);
        tipObj.add(resp);
      } catch (err) {
        console.log(err);
      } finally {
        // 判断是否所有的请求都已完成
        count++;
        if (count === tipsInfoList.length) {
          resolve(tipObj);
        }
        request();
      }
    }
    const times = Math.min(maxNum, tipsInfoList.length);
    for (let i = 0; i < times; i++) {
      request();
    }
  });
}

export function createTipsInfo({ name, position }, isAlarm = false) {
  return new Promise((reslove) => {
    // 创建Canvas元素
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');
    canvas.width = 768;
    canvas.height = 128;
    ctx.fillStyle = 'white';
    ctx.fillRect(0, 0, canvas.width, canvas.height);
    ctx.font = 'bold 100px Arial';
    ctx.fillStyle = 'black';
    ctx.textAlign = 'center';
    ctx.textBaseline = 'middle';
    ctx.fillText(name, canvas.width / 2, canvas.height / 2);

    // 创建纹理
    const texture = new THREE.CanvasTexture(canvas);
    // 创建材质
    const material = new THREE.MeshBasicMaterial({
      map: texture,
      transparent: true, // 透明度为true 保证报警后可以调整透明度闪烁效果
      depthTest: false,
    });
    // 创建几何体
    const geometry = new THREE.PlaneGeometry(150, 25, 1);
    // 创建网格
    const mesh = new THREE.Mesh(geometry, material);
    mesh.renderOrder = 99;
    mesh.name = name.replace(/\./g, '');
    mesh.position.set(position.x, position.y, position.z);
    mesh.rotation.x = -Math.PI / 2; // Add this line to rotate the mesh
    mesh.scale.set(2, 2, 1);
    mesh.isAlarm = isAlarm; // 是否报警
    reslove(mesh);
  });
}