修改

src/main.js

@@ -49,7 +49,6 @@ import DictTag from '@/components/DictTag'
 import DictData from '@/components/DictData'
 
 import leftNav from "@/components/leftNav/index.vue";
-
 // 全局方法挂载
 Vue.prototype.getDicts = getDicts
 Vue.prototype.getConfigKey = getConfigKey

src/utils/three.js

@@ -89,15 +89,7 @@ function createDashedLinesForBall(
     const line = new Line(geo, mat);
     line.computeLineDistances();
     scene.add(line);
-    // return line;
-    // let light = new THREE.DirectionalLight(0xffffff, 0.25);
-    // light.position.setScalar(1);
-    // scene.add(light);
-    // let light = new THREE.AmbientLight(0xffffff, 0.75);
-    // scene.add(light);
-    // 创建箭头
     const dir = new THREE.Vector3();
-    // if (direction === "down") dir.set(0, -1, 0);
     if (direction === "back") dir.set(0, 0, -1);
     else if (direction === "left") dir.set(1, 0, 0);
 
@@ -114,7 +106,7 @@ function createDashedLinesForBall(
       arrowHelper.line.material.opacity = 0.6;
       // 设置箭头头部透明度
       arrowHelper.cone.material = new THREE.MeshBasicMaterial({
-        color: "#00ff00",
+        color: color,
         transparent: true, // 必须设置为true
         opacity: 0.6, // 与线段相同的透明度
       });
@@ -448,7 +440,6 @@ const dracoLoader = new DRACOLoader().setDecoderPath("/draco/"); // 设置Draco
 const gltfLoader = new GLTFLoader().setDRACOLoader(dracoLoader); // GLTF加载器关联Draco
 
 
-
 /* ========== 主函数：画三维坐标轴及交互 ========== */
 /**
  * 在传入的DOM元素内创建完整的三维坐标系、网格面、刻度、球体模型、交互、后处理、UI按钮等。
@@ -605,7 +596,17 @@ export function drawAxes(element, options = {}, ballCallBack) {
   function createDom(i, axes) {
 
     const div = document.createElement('div')
+    div.style.cursor = 'pointer'
+    div.addEventListener('click', () => {
+      console.log('click', i, axes)
 
+    })
+    div.addEventListener('mouseover', () => {
+      console.log('mouseover', i, axes)
+    })
+    div.addEventListener('mouseout', () => {
+      console.log('mouseout', i, axes)
+    })
     const img = document.createElement('img')
 
     img.src = process.env.VUE_APP_BASE_URL + `/icon_xz/${axes}0${i}.png`
@@ -729,13 +730,13 @@ export function drawAxes(element, options = {}, ballCallBack) {
   });
   styleGroups["灰球"] = null;
   const lineGeometryColors = [
-    "#779c6e",
+    "rgb(102,129,102)",
-    "#779c6e",
+    "rgb(79,78,177)",
-    "#3ee4bc",
+    "rgb(81,157,155)",
-    "#ca41e7",
+    "rgb(102,129,102)",
-    "#c88d38",
+    "rgb(166,47,176)",
-    "#7467ef",
+
-    "#c7bef7",
+    "rgb(166,47,176)",
   ];
   const geometryColors = [
     "#888888",