基于vue与three.js给模型添加标签（CSS2DRenderer与CSS2DObject）

import * as THREE from 'three';
import { CSS2DRenderer, CSS2DObject } from 'three/examples/jsm/renderers/CSS2DRenderer.js';
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';
import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js';
import { vue } from 'vue/types/vue';
 
// 假设你已经有了一个Vue组件，并且在其中有一个three.js场景（scene）和渲染器（renderer）
export default {
  data() {
    return {
      scene: null,
      camera: null,
      renderer: null,
      labelRenderer: null,
      model: null
    };
  },
  mounted() {
    this.initScene();
    this.initCamera();
    this.initRenderers();
    this.initListeners();
    this.loadModel();
    this.animate();
  },
  methods: {
    initScene() {
      this.scene = new THREE.Scene();
    },
    initCamera() {
      this.camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
      this.camera.position.z = 5;
    },
    initRenderers() {
      this.renderer = new THREE.WebGLRenderer({ antialias: true });
      this.renderer.setSize(window.innerWidth, window.innerHeight);
      this.renderer.setClearColor(0xffffff);
      document.body.appendChild(this.renderer.domElement);
 
      this.labelRenderer = new CSS2DRenderer();
      this.labelRenderer.setSize(window.innerWidth, window.innerHeight);
      this.labelRenderer.domElement.style.position = 'absolute';
      this.labelRenderer.domElement.style.top = 0;
      document.body.appendChild(this.labelRenderer.domElement);
 
      // 创建OrbitControls来控制相机旋转
      new OrbitControls(this.camera, this.renderer.domElement);
    },
    initListeners() {
      window.addEventListener('resize', this.onWindowResize, false);
    },
    onWindowResize() {
      this.camera.aspect = window.innerWidth / window.innerHeight;
      this.camera.updateProjectionMatrix();
 
      this.renderer.setSize(window.innerWidth, window.innerHeight);
      this.labelRenderer.setSize(window.innerWidth, window.innerHeight);
    },
    loadModel() {
      const loader = new GLTFLoader();
      loader.load('path/to/your/model.gltf', (gltf) => {
        this.model = gltf.scene;
        this.scene.add(this.model);
 
        // 假设模型有几何信息，并且你想要添加标签
        this.model.traverse((child) => {
          if (child.isMesh) {
            // 创建CSS2DObject作为标签
            const label = document.createElement('div');
            label.className = 'label';