babylon创建文字

方案一：

function createApertureText(
  name: string,
  nick: string,
) {
  const planeWidth = 1.6;
  const planeHeight = nick ? 0.6 : 0.3;
  const canvasWidth = 300;
  const canvasHeight = (300 / planeWidth) * planeHeight;
  const plane = BABYLON.MeshBuilder.CreatePlane(`apterture_text`, {
    width: planeWidth,
    height: planeHeight,
    sideOrientation: BABYLON.Mesh.DOUBLESIDE,
    updatable: false,
  });
  plane.position.y = nick ? 2.1 : 1.9;
  plane.billboardMode = BABYLON.Mesh.BILLBOARDMODE_ALL;
  plane.isPickable = false;
  // plane.showBoundingBox = true;
  const texture = new BABYLON.DynamicTexture(`apterture_text`, {
    width: canvasWidth,
    height: canvasHeight,
  });

  const mt = new BABYLON.StandardMaterial(`apterture_text`);
  mt.emissiveTexture = texture;
  mt.opacityTexture = texture;
  mt.disableLighting = true;
  plane.material = mt;

  const ctx = texture.getContext() as CanvasRenderingContext2D;
  ctx.font = '28px Arial';
  ctx.textAlign = 'center';
  ctx.textBaseline = 'middle';
  ctx.lineWidth = 2;
  ctx.strokeStyle = '#5AE0FB';
  ctx.fillStyle = 'white';

  ctx.strokeText(name, canvasWidth / 2, canvasHeight / ( 4 / 3 ));
  ctx.fillText(name, canvasWidth / 2, canvasHeight / ( 4 / 3 ));

  ctx.strokeText(nick, canvasWidth / 2, canvasHeight / 2.5);
  ctx.fillText(nick, canvasWidth / 2, canvasHeight / 2.5);

  texture.update();

  return plane;
}