#

luxiaotao1123

2024-05-16 a450819392b0046573ac34c1121e09ef6fbc3561

 src/components/text.jsx

@@ -17,17 +17,18 @@
  return canvas;
}

const Text = ({
  text,
  position,
  scale = new THREE.Vector3(100, 100, 100),
  color = '#00D1D1',
  fontSize = 50,
}) => {
const Text = (props) => {
  const { text, position, color = '#00D1D1', fontSize = 100 } = props;

  const [material, setMaterial] = useState(undefined);
  const [scale, setScale] = useState(new THREE.Vector3(100, 100, 100));

  useEffect(() => {
    const canvas = generateSprite(text, color, fontSize);
    const texture = new THREE.CanvasTexture(canvas);
    setScale(new THREE.Vector3(texture.image.width / 4, texture.image.height / 4, 1));
    const material = new THREE.SpriteMaterial({
      map: new THREE.CanvasTexture(generateSprite(text, color, fontSize)),
      map: texture,
      blending: THREE.AdditiveBlending,
    });
    setMaterial(material);