import * as THREE from "three";
/**
 * 返回一个带有文字的的#3D材质
 * 把输入的文字转化为base64的img图片
 * @param {String} text
 * @param {String} param 传感器实时检测参数
 */
export default function (text = "", param = "50", width = 80, height = 50) {
  const canvas = document.createElement("canvas");
  canvas.width = width;
  canvas.height = height;
  const ctx = canvas.getContext("2d");
  ctx.fillStyle = "#00b8ec";
  ctx.fillRect(0, 0, width, height);
  ctx.fillStyle = "white";
  ctx.font = "12px serif";
  ctx.fillText(text, (100 - text.length * 15) / 2, 20);
  ctx.fillText(param, (100 - param.length * 10) / 2, 40);
  ctx.strokeStyle = "white";
  ctx.moveTo(0, 26);
  ctx.lineTo(100, 26);
  ctx.stroke();
  const base64 = canvas.toDataURL();
  return new THREE.MeshBasicMaterial({
    map: new THREE.TextureLoader().load(base64),
  });
}
