gx

package.json

@@ -4,8 +4,6 @@
   "private": true,
   "dependencies": {
     "@ant-design/cssinjs": "^1.5.6",
-    "@dage/krpano": "^3.0.0",
-    "@dage/pc-components": "^1.3.11",
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^13.5.0",
@@ -18,11 +16,8 @@
     "axios": "^1.13.2",
     "classnames": "^2.5.1",
     "crypto-js": "^4.2.0",
-    "i18next": "^25.6.3",
-    "i18next-browser-languagedetector": "^8.2.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-i18next": "^16.3.5",
     "react-redux": "^8.0.4",
     "react-router-dom": "5.3",
     "react-scripts": "5.0.1",
@@ -31,7 +26,6 @@
     "redux-devtools-extension": "^2.13.9",
     "redux-thunk": "^2.4.1",
     "sass": "^1.55.0",
-    "svg-pan-zoom": "^3.6.2",
     "typescript": "^4.8.4",
     "vconsole": "^3.15.1",
     "web-vitals": "^2.1.4"
@@ -68,4 +62,4 @@
     "react-app-rewired": "^2.2.1"
   },
   "homepage": "."
-}
+}

public/unityMo/StreamingAssets/Settings.json

@@ -6,207 +6,72 @@
     {
       "name": "Panel1Camera",
       "camera": {
-        "position": {
-          "x": 0,
-          "y": 0,
-          "z": -13
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        },
-        "physicalLensShift": {
-          "x": 0.25,
-          "y": 0
-        }
+        "position": { "x": 0, "y": 0, "z": -13 },
+        "rotation": { "x": 0, "y": 0, "z": 0 },
+        "physicalLensShift": { "x": 0.25, "y": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -180,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -4.5,
-          "max": 4.5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -8,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": -180, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -4.5, "max": 4.5 },
+        "limitY": { "isLimit": true, "min": -8, "max": 8 }
       }
     },
     {
       "name": "Panel2Camera",
       "camera": {
-        "position": {
-          "x": 0,
-          "y": 0,
-          "z": -13
-        },
-        "physicalLensShift": {
-          "x": 0.2,
-          "y": 0
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "position": { "x": 0, "y": 0, "z": -13 },
+        "physicalLensShift": { "x": 0.2, "y": 0 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -180,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -5,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -8,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": -180, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -5, "max": 5 },
+        "limitY": { "isLimit": true, "min": -8, "max": 8 }
       }
     },
     {
       "name": "Panel3Camera",
       "camera": {
-        "position": {
-          "x": 0,
-          "y": 0,
-          "z": -13
-        },
-        "physicalLensShift": {
-          "x": 0,
-          "y": 0
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "position": { "x": 0, "y": 0, "z": -13 },
+        "physicalLensShift": { "x": 0, "y": 0 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -180,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -10,
-          "max": 10
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -8,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": -180, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -10, "max": 10 },
+        "limitY": { "isLimit": true, "min": -8, "max": 8 }
       }
     },
     {
       "name": "Panel4Camera",
       "rotationNotAllowed": true,
       "camera": {
-        "position": {
-          "x": 0,
-          "y": 0.5,
-          "z": -11.5
-        },
-        "physicalLensShift": {
-          "x": 0.2,
-          "y": 0
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "position": { "x": 0, "y": 0.5, "z": -11.5 },
+        "physicalLensShift": { "x": 0.2, "y": 0 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -4,
-          "max": 4
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -8,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": 0, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -4, "max": 4 },
+        "limitY": { "isLimit": true, "min": -8, "max": 8 }
       }
     },
     {
       "name": "Panel5Camera",
       "camera": {
-        "position": {
-          "x": 0,
-          "y": 0,
-          "z": -14
-        },
-        "physicalLensShift": {
-          "x": 0,
-          "y": 0
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "position": { "x": 0, "y": 0, "z": -14 },
+        "physicalLensShift": { "x": 0, "y": 0 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -180,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -15,
-          "max": 15
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -8,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": -180, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -15, "max": 15 },
+        "limitY": { "isLimit": true, "min": -8, "max": 8 }
       }
     }
   ],
@@ -216,42 +81,15 @@
       "intensityAnimationTime": 0.8,
       "startIntensity": 0,
       "camera": {
-        "position": {
-          "x": 0,
-          "y": 1.6,
-          "z": -9
-        },
-        "physicalLensShift": {
-          "x": -0.08,
-          "y": 0
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "position": { "x": 0, "y": 1.6, "z": -9 },
+        "physicalLensShift": { "x": -0.08, "y": 0 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -180,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -5,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -5,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": -180, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -5, "max": 5 },
+        "limitY": { "isLimit": true, "min": -5, "max": 8 }
       }
     },
     {
@@ -259,42 +97,15 @@
       "intensityAnimationTime": 0.8,
       "startIntensity": 0,
       "camera": {
-        "physicalLensShift": {
-          "x": -0.1,
-          "y": 0
-        },
-        "position": {
-          "x": 0,
-          "y": 0.8,
-          "z": -8
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "physicalLensShift": { "x": -0.1, "y": 0 },
+        "position": { "x": 0, "y": 0.8, "z": -8 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -180,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -5,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -5,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": -180, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -5, "max": 5 },
+        "limitY": { "isLimit": true, "min": -5, "max": 8 }
       }
     },
     {
@@ -302,42 +113,15 @@
       "intensityAnimationTime": 0.8,
       "startIntensity": 0,
       "camera": {
-        "physicalLensShift": {
-          "x": -0.1,
-          "y": 0
-        },
-        "position": {
-          "x": 0,
-          "y": 0.8,
-          "z": -8
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "physicalLensShift": { "x": -0.1, "y": 0 },
+        "position": { "x": 0, "y": 0.8, "z": -8 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -180,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -5,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -5,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": -180, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -5, "max": 5 },
+        "limitY": { "isLimit": true, "min": -5, "max": 8 }
       }
     },
     {
@@ -345,42 +129,15 @@
       "intensityAnimationTime": 0.8,
       "startIntensity": 0,
       "camera": {
-        "physicalLensShift": {
-          "x": -0.1,
-          "y": 0
-        },
-        "position": {
-          "x": 0,
-          "y": 3,
-          "z": -8
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "physicalLensShift": { "x": -0.1, "y": 0 },
+        "position": { "x": 0, "y": 3, "z": -8 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -180,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -5,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": 0,
-          "max": 12
-        }
+        "rotation": { "x": 0, "y": -180, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -5, "max": 5 },
+        "limitY": { "isLimit": true, "min": 0, "max": 12 }
       }
     },
     {
@@ -388,42 +145,15 @@
       "intensityAnimationTime": 0.8,
       "startIntensity": 0,
       "camera": {
-        "physicalLensShift": {
-          "x": -0.1,
-          "y": 0
-        },
-        "position": {
-          "x": 0,
-          "y": -4,
-          "z": -8
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "physicalLensShift": { "x": -0.1, "y": 0 },
+        "position": { "x": 0, "y": -4, "z": -8 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -180,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -5,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -12,
-          "max": -1
-        }
+        "rotation": { "x": 0, "y": -180, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -5, "max": 5 },
+        "limitY": { "isLimit": true, "min": -12, "max": -1 }
       }
     },
     {
@@ -431,42 +161,15 @@
       "intensityAnimationTime": 0.8,
       "startIntensity": 0,
       "camera": {
-        "physicalLensShift": {
-          "x": -0.08,
-          "y": 0
-        },
-        "position": {
-          "x": 0,
-          "y": 2.5,
-          "z": -8
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "physicalLensShift": { "x": -0.08, "y": 0 },
+        "position": { "x": 0, "y": 2.5, "z": -8 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -90,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -5,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -1,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": -90, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -5, "max": 5 },
+        "limitY": { "isLimit": true, "min": -1, "max": 8 }
       }
     },
     {
@@ -474,42 +177,15 @@
       "intensityAnimationTime": 0.8,
       "startIntensity": 0,
       "camera": {
-        "physicalLensShift": {
-          "x": -0.08,
-          "y": 0
-        },
-        "position": {
-          "x": 0,
-          "y": -0.5,
-          "z": -8
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "physicalLensShift": { "x": -0.08, "y": 0 },
+        "position": { "x": 0, "y": -0.5, "z": -8 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -90,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -5,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -6,
-          "max": 5
-        }
+        "rotation": { "x": 0, "y": -90, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -5, "max": 5 },
+        "limitY": { "isLimit": true, "min": -6, "max": 5 }
       }
     },
     {
@@ -517,42 +193,15 @@
       "intensityAnimationTime": 0.8,
       "startIntensity": 0,
       "camera": {
-        "physicalLensShift": {
-          "x": -0.08,
-          "y": 0
-        },
-        "position": {
-          "x": 0,
-          "y": -3,
-          "z": -8
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "physicalLensShift": { "x": -0.08, "y": 0 },
+        "position": { "x": 0, "y": -3, "z": -8 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -90,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -5,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -8,
-          "max": 3
-        }
+        "rotation": { "x": 0, "y": -90, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -5, "max": 5 },
+        "limitY": { "isLimit": true, "min": -8, "max": 3 }
       }
     }
   ],
@@ -562,42 +211,15 @@
       "intensityAnimationTime": 0,
       "startIntensity": 0,
       "camera": {
-        "position": {
-          "x": 1.2,
-          "y": 4.3,
-          "z": -5
-        },
-        "physicalLensShift": {
-          "x": 0.3,
-          "y": 0
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "position": { "x": 1.2, "y": 4.3, "z": -5 },
+        "physicalLensShift": { "x": 0.3, "y": 0 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -90,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -1,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": 2,
-          "max": 15
-        }
+        "rotation": { "x": 0, "y": -90, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -1, "max": 5 },
+        "limitY": { "isLimit": true, "min": 2, "max": 15 }
       }
     },
     {
@@ -605,42 +227,15 @@
       "intensityAnimationTime": 0,
       "startIntensity": 0,
       "camera": {
-        "position": {
-          "x": 1.8,
-          "y": 2,
-          "z": -7
-        },
-        "physicalLensShift": {
-          "x": 0.25,
-          "y": 0
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "position": { "x": 1.8, "y": 2, "z": -7 },
+        "physicalLensShift": { "x": 0.25, "y": 0 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -180,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": 0,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -3,
-          "max": 9
-        }
+        "rotation": { "x": 0, "y": -180, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": 0, "max": 5 },
+        "limitY": { "isLimit": true, "min": -3, "max": 9 }
       }
     },
     {
@@ -648,42 +243,15 @@
       "intensityAnimationTime": 0,
       "startIntensity": 0,
       "camera": {
-        "position": {
-          "x": 2,
-          "y": 0,
-          "z": -12
-        },
-        "physicalLensShift": {
-          "x": 0.2,
-          "y": 0
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "position": { "x": 1.5, "y": -0.5, "z": -12.3 },
+        "physicalLensShift": { "x": 0.2, "y": 0 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -5,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -8,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": 0, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -5, "max": 5 },
+        "limitY": { "isLimit": true, "min": -8, "max": 8 }
       }
     },
     {
@@ -691,59 +259,23 @@
       "intensityAnimationTime": 0,
       "startIntensity": 0,
       "camera": {
-        "position": {
-          "x": 2,
-          "y": 0,
-          "z": -12
-        },
-        "physicalLensShift": {
-          "x": 0.2,
-          "y": 0
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "position": { "x": 1.5, "y": -0.5, "z": -12.3 },
+        "physicalLensShift": { "x": 0.2, "y": 0 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        },
-        "physicalLensShift": {
-          "x": 0.2,
-          "y": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -10,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -8,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": 0, "z": 0 },
+        "physicalLensShift": { "x": 0.2, "y": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -10, "max": 5 },
+        "limitY": { "isLimit": true, "min": -8, "max": 8 }
       }
     }
   ],
   "stepBg": {
     "showAnimationTime": 0,
     "hideAnimationTime": 0,
-    "anchorMin": {
-      "x": 0,
-      "y": 0
-    },
-    "anchorMax": {
-      "x": 0.9,
-      "y": 0.98
-    }
+    "anchorMin": { "x": 0, "y": 0 },
+    "anchorMax": { "x": 0.9, "y": 0.98 }
   }
-}
+}

public/unityPc/StreamingAssets/Settings.json

@@ -6,207 +6,72 @@
     {
       "name": "Panel1Camera",
       "camera": {
-        "position": {
-          "x": 0,
-          "y": 0,
-          "z": -13
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        },
-        "physicalLensShift": {
-          "x": 0.25,
-          "y": 0
-        }
+        "position": { "x": 0, "y": 0, "z": -13 },
+        "rotation": { "x": 0, "y": 0, "z": 0 },
+        "physicalLensShift": { "x": 0.25, "y": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -180,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -4.5,
-          "max": 4.5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -8,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": -180, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -4.5, "max": 4.5 },
+        "limitY": { "isLimit": true, "min": -8, "max": 8 }
       }
     },
     {
       "name": "Panel2Camera",
       "camera": {
-        "position": {
-          "x": 0,
-          "y": 0,
-          "z": -13
-        },
-        "physicalLensShift": {
-          "x": 0.2,
-          "y": 0
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "position": { "x": 0, "y": 0, "z": -13 },
+        "physicalLensShift": { "x": 0.2, "y": 0 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -180,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -5,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -8,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": -180, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -5, "max": 5 },
+        "limitY": { "isLimit": true, "min": -8, "max": 8 }
       }
     },
     {
       "name": "Panel3Camera",
       "camera": {
-        "position": {
-          "x": 0,
-          "y": 0,
-          "z": -13
-        },
-        "physicalLensShift": {
-          "x": 0,
-          "y": 0
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "position": { "x": 0, "y": 0, "z": -13 },
+        "physicalLensShift": { "x": 0, "y": 0 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -180,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -10,
-          "max": 10
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -8,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": -180, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -10, "max": 10 },
+        "limitY": { "isLimit": true, "min": -8, "max": 8 }
       }
     },
     {
       "name": "Panel4Camera",
       "rotationNotAllowed": true,
       "camera": {
-        "position": {
-          "x": 0,
-          "y": 0.5,
-          "z": -11.5
-        },
-        "physicalLensShift": {
-          "x": 0.2,
-          "y": 0
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "position": { "x": 0, "y": 0.5, "z": -11.5 },
+        "physicalLensShift": { "x": 0.2, "y": 0 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -4,
-          "max": 4
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -8,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": 0, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -4, "max": 4 },
+        "limitY": { "isLimit": true, "min": -8, "max": 8 }
       }
     },
     {
       "name": "Panel5Camera",
       "camera": {
-        "position": {
-          "x": 0,
-          "y": 0,
-          "z": -14
-        },
-        "physicalLensShift": {
-          "x": 0,
-          "y": 0
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "position": { "x": 0, "y": 0, "z": -14 },
+        "physicalLensShift": { "x": 0, "y": 0 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -180,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -15,
-          "max": 15
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -8,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": -180, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -15, "max": 15 },
+        "limitY": { "isLimit": true, "min": -8, "max": 8 }
       }
     }
   ],
@@ -216,42 +81,15 @@
       "intensityAnimationTime": 0.8,
       "startIntensity": 0,
       "camera": {
-        "position": {
-          "x": 0,
-          "y": 1.6,
-          "z": -9
-        },
-        "physicalLensShift": {
-          "x": -0.08,
-          "y": 0
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "position": { "x": 0, "y": 1.6, "z": -9 },
+        "physicalLensShift": { "x": -0.08, "y": 0 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -180,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -5,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -5,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": -180, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -5, "max": 5 },
+        "limitY": { "isLimit": true, "min": -5, "max": 8 }
       }
     },
     {
@@ -259,42 +97,15 @@
       "intensityAnimationTime": 0.8,
       "startIntensity": 0,
       "camera": {
-        "physicalLensShift": {
-          "x": -0.1,
-          "y": 0
-        },
-        "position": {
-          "x": 0,
-          "y": 0.8,
-          "z": -8
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "physicalLensShift": { "x": -0.1, "y": 0 },
+        "position": { "x": 0, "y": 0.8, "z": -8 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -180,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -5,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -5,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": -180, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -5, "max": 5 },
+        "limitY": { "isLimit": true, "min": -5, "max": 8 }
       }
     },
     {
@@ -302,42 +113,15 @@
       "intensityAnimationTime": 0.8,
       "startIntensity": 0,
       "camera": {
-        "physicalLensShift": {
-          "x": -0.1,
-          "y": 0
-        },
-        "position": {
-          "x": 0,
-          "y": 0.8,
-          "z": -8
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "physicalLensShift": { "x": -0.1, "y": 0 },
+        "position": { "x": 0, "y": 0.8, "z": -8 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -180,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -5,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -5,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": -180, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -5, "max": 5 },
+        "limitY": { "isLimit": true, "min": -5, "max": 8 }
       }
     },
     {
@@ -345,42 +129,15 @@
       "intensityAnimationTime": 0.8,
       "startIntensity": 0,
       "camera": {
-        "physicalLensShift": {
-          "x": -0.1,
-          "y": 0
-        },
-        "position": {
-          "x": 0,
-          "y": 3,
-          "z": -8
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "physicalLensShift": { "x": -0.1, "y": 0 },
+        "position": { "x": 0, "y": 3, "z": -8 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -180,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -5,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": 0,
-          "max": 12
-        }
+        "rotation": { "x": 0, "y": -180, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -5, "max": 5 },
+        "limitY": { "isLimit": true, "min": 0, "max": 12 }
       }
     },
     {
@@ -388,42 +145,15 @@
       "intensityAnimationTime": 0.8,
       "startIntensity": 0,
       "camera": {
-        "physicalLensShift": {
-          "x": -0.1,
-          "y": 0
-        },
-        "position": {
-          "x": 0,
-          "y": -4,
-          "z": -8
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "physicalLensShift": { "x": -0.1, "y": 0 },
+        "position": { "x": 0, "y": -4, "z": -8 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -180,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -5,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -12,
-          "max": -1
-        }
+        "rotation": { "x": 0, "y": -180, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -5, "max": 5 },
+        "limitY": { "isLimit": true, "min": -12, "max": -1 }
       }
     },
     {
@@ -431,42 +161,15 @@
       "intensityAnimationTime": 0.8,
       "startIntensity": 0,
       "camera": {
-        "physicalLensShift": {
-          "x": -0.08,
-          "y": 0
-        },
-        "position": {
-          "x": 0,
-          "y": 2.5,
-          "z": -8
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "physicalLensShift": { "x": -0.08, "y": 0 },
+        "position": { "x": 0, "y": 2.5, "z": -8 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -90,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -5,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -1,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": -90, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -5, "max": 5 },
+        "limitY": { "isLimit": true, "min": -1, "max": 8 }
       }
     },
     {
@@ -474,42 +177,15 @@
       "intensityAnimationTime": 0.8,
       "startIntensity": 0,
       "camera": {
-        "physicalLensShift": {
-          "x": -0.08,
-          "y": 0
-        },
-        "position": {
-          "x": 0,
-          "y": -0.5,
-          "z": -8
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "physicalLensShift": { "x": -0.08, "y": 0 },
+        "position": { "x": 0, "y": -0.5, "z": -8 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -90,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -5,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -6,
-          "max": 5
-        }
+        "rotation": { "x": 0, "y": -90, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -5, "max": 5 },
+        "limitY": { "isLimit": true, "min": -6, "max": 5 }
       }
     },
     {
@@ -517,42 +193,15 @@
       "intensityAnimationTime": 0.8,
       "startIntensity": 0,
       "camera": {
-        "physicalLensShift": {
-          "x": -0.08,
-          "y": 0
-        },
-        "position": {
-          "x": 0,
-          "y": -3,
-          "z": -8
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "physicalLensShift": { "x": -0.08, "y": 0 },
+        "position": { "x": 0, "y": -3, "z": -8 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -90,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -5,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -8,
-          "max": 3
-        }
+        "rotation": { "x": 0, "y": -90, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -5, "max": 5 },
+        "limitY": { "isLimit": true, "min": -8, "max": 3 }
       }
     }
   ],
@@ -562,42 +211,15 @@
       "intensityAnimationTime": 0,
       "startIntensity": 0,
       "camera": {
-        "position": {
-          "x": 1.2,
-          "y": 4.3,
-          "z": -5
-        },
-        "physicalLensShift": {
-          "x": 0.3,
-          "y": 0
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "position": { "x": 1.2, "y": 4.3, "z": -5 },
+        "physicalLensShift": { "x": 0.3, "y": 0 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -90,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -1,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": 2,
-          "max": 15
-        }
+        "rotation": { "x": 0, "y": -90, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -1, "max": 5 },
+        "limitY": { "isLimit": true, "min": 2, "max": 15 }
       }
     },
     {
@@ -605,42 +227,15 @@
       "intensityAnimationTime": 0,
       "startIntensity": 0,
       "camera": {
-        "position": {
-          "x": 1.8,
-          "y": 2,
-          "z": -7
-        },
-        "physicalLensShift": {
-          "x": 0.25,
-          "y": 0
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "position": { "x": 1.8, "y": 2, "z": -7 },
+        "physicalLensShift": { "x": 0.25, "y": 0 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": -180,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": 0,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -3,
-          "max": 9
-        }
+        "rotation": { "x": 0, "y": -180, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": 0, "max": 5 },
+        "limitY": { "isLimit": true, "min": -3, "max": 9 }
       }
     },
     {
@@ -648,42 +243,15 @@
       "intensityAnimationTime": 0,
       "startIntensity": 0,
       "camera": {
-        "position": {
-          "x": 2,
-          "y": 0,
-          "z": -12
-        },
-        "physicalLensShift": {
-          "x": 0.2,
-          "y": 0
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "position": { "x": 1.5, "y": -0.5, "z": -12.3 },
+        "physicalLensShift": { "x": 0.2, "y": 0 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -5,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -8,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": 0, "z": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -5, "max": 5 },
+        "limitY": { "isLimit": true, "min": -8, "max": 8 }
       }
     },
     {
@@ -691,59 +259,23 @@
       "intensityAnimationTime": 0,
       "startIntensity": 0,
       "camera": {
-        "position": {
-          "x": 2,
-          "y": 0,
-          "z": -12
-        },
-        "physicalLensShift": {
-          "x": 0.2,
-          "y": 0
-        },
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        }
+        "position": { "x": 1.5, "y": -0.5, "z": -12.3 },
+        "physicalLensShift": { "x": 0.2, "y": 0 },
+        "rotation": { "x": 0, "y": 0, "z": 0 }
       },
       "model": {
-        "rotation": {
-          "x": 0,
-          "y": 0,
-          "z": 0
-        },
-        "physicalLensShift": {
-          "x": 0.2,
-          "y": 0
-        },
-        "limitScale": {
-          "isLimit": true,
-          "min": 0.2,
-          "max": 1.5
-        },
-        "limitX": {
-          "isLimit": true,
-          "min": -10,
-          "max": 5
-        },
-        "limitY": {
-          "isLimit": true,
-          "min": -8,
-          "max": 8
-        }
+        "rotation": { "x": 0, "y": 0, "z": 0 },
+        "physicalLensShift": { "x": 0.2, "y": 0 },
+        "limitScale": { "isLimit": true, "min": 0.2, "max": 1.5 },
+        "limitX": { "isLimit": true, "min": -10, "max": 5 },
+        "limitY": { "isLimit": true, "min": -8, "max": 8 }
       }
     }
   ],
   "stepBg": {
     "showAnimationTime": 0,
     "hideAnimationTime": 0,
-    "anchorMin": {
-      "x": 0,
-      "y": 0
-    },
-    "anchorMax": {
-      "x": 0.9,
-      "y": 0.98
-    }
+    "anchorMin": { "x": 0, "y": 0 },
+    "anchorMax": { "x": 0.9, "y": 0.98 }
   }
-}
+}

src/App.tsx

@@ -255,6 +255,10 @@ export default function App() {
     if (envFlag) {
       window.addEventListener('keyup', e => {
         if (e.code === 'Enter') {
+
+
+
+
           callIframeFu(
             'refreshAppSettings',
             JSON.stringify({
@@ -908,9 +912,9 @@ export default function App() {
                   startIntensity: 0,
                   camera: {
                     position: {
-                      x: 2,
-                      y: 0,
-                      z: -12
+                      x: 1.5,
+                      y: -0.5,
+                      z: -12.3
                     },
                     physicalLensShift: {
                       x: 0.2,
@@ -951,9 +955,9 @@ export default function App() {
                   startIntensity: 0,
                   camera: {
                     position: {
-                      x: 2,
-                      y: 0,
-                      z: -12
+                      x: 1.5,
+                      y: -0.5,
+                      z: -12.3
                     },
                     physicalLensShift: {
                       x: 0.2,

src/components/PdfViewer/index.tsx

@@ -0,0 +1,15 @@
+import React from 'react'
+
+import PDFViewer from 'pdf-viewer-reactjs'
+
+const PdfViewer = () => {
+  return (
+    <PDFViewer
+      document={{
+        url: 'myData/pdfs/pdfTEST.pdf',
+      }}
+    />
+  )
+}
+
+export default PdfViewer

src/pages/A0base/index.tsx

@@ -76,7 +76,7 @@ function A0base() {
           <div className={`title ${isChanging ? 'titleAc' : 'titleAni'} songFontc`}>
             {myData.baseInfo[currentBase].title}
           </div>
-          <div className={`text ${isChanging ? 'textAc' : 'textAni'} songFontc`}>{myData.baseInfo[currentBase].text}</div>
+          <div className={`text ${isChanging ? 'textAc' : 'textAni'} `}>{myData.baseInfo[currentBase].text}</div>
           <div
             className='btn'
             id='opacityChange'

src/pages/A3beie/index.tsx

@@ -53,7 +53,6 @@ function A3beie() {
             {myLangue === 'EN'
               ? ' A blank space approximately 15 cm high is left at the top of the stele,'
               : '碑额留出高约15厘米的空白范围，'}
-            <br />{' '}
             {myLangue === 'EN'
               ? ' with only the date of the stele’s creation inscribed on the left side.'
               : '仅在碑额左侧题写造碑日期。'}
@@ -61,7 +60,6 @@ function A3beie() {
             {myLangue === 'EN'
               ? 'The Shanxi Tongzhi notes: "The stele’s heading records, ‘Completed on the 3rd day of the 11th month of the jiazi year,'
               : '《山西通志》指出：其“碑额题‘大魏天平元年岁次甲寅十一月庚辰朔三日壬午造讫’岁月书额，'}
-            <br />{' '}
             {myLangue === 'EN'
               ? 'the first year of the Tianping era of the Great Wei’—such a practice of inscribing the date on the stele’s heading is rarely seen before the Tang Dynasty’s Jinci Stele Inscription of the Zhenguan era."'
               : '唐贞观晋祠铭以前，此为仅见”。'}

src/pages/A6ybwx/A6_2_zxzgh/index.tsx

@@ -2,7 +2,6 @@ import React, { useState, useRef, useEffect } from 'react'
 import styles from './index.module.scss'
 import { useSelector } from 'react-redux'
 import { RootState } from '@/store'
-import iosTouch from '@/utils/iosTouch'
 import Bwzzq from './components/Bwzzq'
 import Bwzwq from './components/Bwzwq'
 import Bwwq from './components/Bwwq'
@@ -34,10 +33,6 @@ function Sinicize({ setGotopage }: { setGotopage: (page: number) => void }) {
   const sinicize1Ref = useRef<HTMLDivElement>(null)
   // const ori_touchStartX = useRef<number>(0)
 
-  useEffect(() => {
-    iosTouch('A7Sinicize')
-  }, [])
-
   // width 线的长度 inset 整体的定位 name 文字 direct 方向 left/right
   const Label = ({
     width,

src/pages/A6ybwx/Genealogy/components/GraphSVG/index.module.scss

@@ -1,50 +0,0 @@
-.SVGContainner {
-  width: 100%;
-  height: 100%;
-  position: relative;
-  :global {
-    .graphSvg {
-      width: 100%;
-      height: 100%;
-      position: absolute;
-      top: 0;
-      left: 0;
-      background: #ccc;
-    }
-  }
-}
-
-.miniMap {
-  position: fixed;
-  left: 20px;
-  bottom: 20px;
-  width: 300px;
-  height: 80px;
-  background: rgba(0, 0, 0, 0.5);
-  border: 1px solid rgba(255, 233, 182, 0.5);
-  overflow: hidden;
-
-  .viewport {
-    position: absolute;
-    border: 1px solid #ffe9b6;
-    cursor: move;
-    background: rgba(255, 233, 182, 0.1);
-  }
-
-  .miniContent {
-    transform-origin: 0 0;
-    pointer-events: none;
-    width: 3000px;
-    height: 800px;
-    position: relative;
-    touch-action: none;
-    :global {
-      .nodeActiveG {
-        position: absolute;
-        top: 50%;
-        left: 50%;
-        transform: translate(-50%, -50%);
-      }
-    }
-  }
-}

src/pages/A6ybwx/Genealogy/components/GraphSVG/index.tsx

@@ -1,104 +0,0 @@
-import React, { useEffect, useRef, useState } from 'react'
-import styles from './index.module.scss'
-import { ReactComponent as GraphSvg } from '@/assets/img/Graph.svg'
-import svgPanZoom from 'svg-pan-zoom'
-import { useDrag } from '@use-gesture/react'
-
-const MAIN_CONTENT_WIDTH = 1920
-const MAIN_CONTENT_HEIGHT = 945
-const MINIMAP_SCALE = 0.045
-function SvgGraph() {
-  const [startX, setStartX] = useState(0)
-  const [startY, setStartY] = useState(0)
-  const [offsetX, setOffsetX] = useState(0)
-  const [offsetY, setOffsetY] = useState(0)
-  const svgRef = useRef<any>(null)
-  const panZoomInstance = useRef<ReturnType<typeof svgPanZoom> | null>(null)
-
-  // 小地图相关逻辑
-
-  const miniMapScale = 0.1
-
-  // 小地图拖拽绑定
-  const bind = useDrag(({ offset: [x, y] }) => {
-    if (!panZoomInstance.current) return;
-    console.log(123123, offsetX, offsetY)
-    // 计算视口位置
-    const viewportX = x / miniMapScale;  // 减去初始 X 偏移
-    const viewportY = y / miniMapScale;
-
-
-    // 更新主视图位置
-    panZoomInstance.current.pan({  // 使用正确的实例方法
-      x: -viewportX,
-      y: -viewportY
-    });
-
-
-  });
-
-
-  // 设置拖拽
-  useEffect(() => {
-    if (svgRef.current) {
-      // 初始化 svg-pan-zoom
-      svgRef.current.setAttribute('viewBox', '0 0 3000 800')
-      panZoomInstance.current = svgPanZoom(svgRef.current, {
-        zoomEnabled: false,
-        dblClickZoomEnabled: false,
-        panEnabled: true,
-        controlIconsEnabled: false,
-        fit: false,
-        contain: false,
-        center: false,
-        beforePan: (newPos) => {
-          console.log(456, newPos.x, newPos.y)
-          setOffsetX(newPos.x);
-          setOffsetY(newPos.y);
-        },
-      })
-      panZoomInstance.current.pan({ x: 300, y: 100 })
-      panZoomInstance.current.zoom(2.85)
-      // setOffsetX(0)
-      // setOffsetY(-200)
-    }
-
-    return () => {
-      // 组件卸载时销毁实例
-      if (panZoomInstance.current) {
-        panZoomInstance.current.destroy()
-      }
-    }
-  }, [])
-
-  return (
-    <>
-      <div className={styles.SVGContainner}>
-        <GraphSvg ref={svgRef} className='graphSvg' />
-      </div>
-      <div className={styles.miniMap}>
-        <div
-          className={styles.viewport}
-          {...bind({ offsetX, offsetY })}
-          style={{
-            transform: `translate(${-offsetX * miniMapScale}px, ${-offsetY * miniMapScale}px)`,
-            width: `${MAIN_CONTENT_WIDTH * MINIMAP_SCALE}px`,
-            height: `${MAIN_CONTENT_HEIGHT * MINIMAP_SCALE}px`
-          }}
-        />
-        <div
-          className={styles.miniContent}
-          style={{
-            transform: `scale(${miniMapScale})`,
-          }}
-        >
-          <GraphSvg className='graphSvg' />
-        </div>
-      </div>
-    </>
-  )
-}
-
-const MemoSvgGraph = React.memo(SvgGraph)
-
-export default MemoSvgGraph

src/pages/A6ybwx/Sangzang/components/Policy/index.module.scss

@@ -71,7 +71,7 @@
             width: 100%;
             height: 54%;
 
-            &>img {
+            & > img {
               width: 100%;
               height: 100%;
               object-fit: fill;
@@ -104,8 +104,6 @@
             white-space: normal;
             transition: width 0.6s ease-in-out, padding 0.86s ease-in-out, opacity 0.3s ease-in-out;
 
-
-
             &::-webkit-scrollbar {
               width: 0;
               height: 0;
@@ -114,14 +112,26 @@
 
           .part1 {
             background-image: url('../../../../../assets/img/A6_policy_part_bg1.jpg');
-            background-size: #ddd6c2;
             background-size: 100% 100%;
             padding-bottom: 40px;
 
             .part1Box {
               width: 100%;
               height: 100%;
+              padding-bottom: 20px;
               overflow: auto;
+              mask-image: linear-gradient(
+                to bottom,
+                rgba(0, 0, 0, 1) 0%,
+                rgba(0, 0, 0, 1) 80%,
+                /* 保留顶部70%不透明 */ rgba(0, 0, 0, 0) 100% /* 底部30%完全透明 */
+              );
+              -webkit-mask-image: linear-gradient(
+                to bottom,
+                rgba(0, 0, 0, 1) 0%,
+                rgba(0, 0, 0, 1) 80%,
+                rgba(0, 0, 0, 0) 100%
+              );
 
               &::-webkit-scrollbar {
                 width: 0;
@@ -163,23 +173,6 @@
                 height: fit-content;
               }
             }
-
-            &::before {
-              content: '';
-              position: absolute;
-              bottom: 0;
-              left: 0;
-              width: 100%;
-              height: 30%;
-              pointer-events: none;
-              z-index: 10;
-              // background-image: url('../../../../../assets/sgImg/mask.png');
-              // background-size: 100% 100%;
-              background: linear-gradient(to top,
-                  rgba(255, 255, 255, 0.8),
-                  20%,
-                  rgba(255, 255, 255, 0));
-            }
           }
 
           .part2 {
@@ -201,7 +194,7 @@
               justify-content: space-between;
               text-align: center;
 
-              &>img {
+              & > img {
                 height: 78%;
                 max-width: 50%;
                 object-fit: contain;
@@ -261,7 +254,7 @@
                   position: relative;
                   font-size: 15px;
 
-                  &>img {
+                  & > img {
                     position: absolute;
                     top: 50%;
                     left: 50%;
@@ -344,7 +337,7 @@
           color: #7c4b36;
         }
 
-        &>img {
+        & > img {
           height: 24px;
           object-fit: contain;
         }
@@ -369,4 +362,4 @@
       }
     }
   }
-}
+}

src/pages/A7wjwj/conponents/Discover/index.tsx

@@ -5,8 +5,10 @@ import classNames from 'classnames'
 import { useSelector } from 'react-redux'
 import { RootState } from '@/store'
 import { delUnityFu } from '@/pages/A0base/data'
+import PdfViewer from '@/components/PdfViewer'
 
 function Discover(props: { style?: React.CSSProperties }) {
+  const [isShowPdf, setIsShowPdf] = useState(false)
   const { myData, myLangue } = useSelector((state: RootState) => state.A0Layout)
 
   // 将隐藏的页面打开，全景图->诗歌->大场景
@@ -126,9 +128,11 @@ function Discover(props: { style?: React.CSSProperties }) {
           ))}
         </div>
       </div>
-      <div className='direct'>
+      <div className='direct' onClick={() => setIsShowPdf(true)}>
         <img src={require('@/assets/img/A7_direct.png')} alt='' draggable={false} />
       </div>
+      {isShowPdf && <div style={{ width: '100%', height: '100%', position: 'fixed', top: 0, left: 0, zIndex: 1000 }}> <PdfViewer />
+      </div>}
     </div>
   )
 }

src/utils/iosTouch.ts

@@ -1,52 +0,0 @@
-const iosTouch = (id: string) => {
-  let startY = 0;
-  let startX = 0;
-  const scrollContainer = document.getElementById(id);
-  console.log(scrollContainer);
-
-  if (!scrollContainer) {
-    return;
-  }
-
-// 监听触摸事件，阻止顶部下拉溢出
-scrollContainer.addEventListener('touchstart', (e) => {
-  startY = e.touches[0].clientY; // 记录触摸起始位置
-  startX = e.touches[0].clientX; // 记录触摸起始位置
-}, { passive: true });
-
-scrollContainer.addEventListener('touchmove', (e) => {
-  const currentY = e.touches[0].clientY;
-  const currentX = e.touches[0].clientX;
-
-  const scrollTop = scrollContainer.scrollTop;
-  const scrollLeft = scrollContainer.scrollLeft;
-
-  // 当滚动到容器顶部（scrollTop = 0），且继续下拉（currentY > startY），阻止默认行为
-  // if (scrollTop <= 0 && currentY > startY) {
-  //   e.preventDefault();
-  // }
-
-  // 当滚动到容器左侧（scrollLeft = 0），且继续右拉（currentX < startX），阻止默认行为
-  // if (scrollLeft <= 0 && currentX < startX) {
-  //   e.preventDefault();
-  // }
-
-  // 当滚动到容器右侧（scrollLeft >= scrollWidth - clientWidth），且继续左拉（currentX > startX），阻止默认行为
-  // const scrollWidth = scrollContainer.scrollWidth;
-  // const clientWidth = scrollContainer.clientWidth;
-  // if (scrollLeft >= scrollWidth - clientWidth && currentX > startX) {
-  //   e.preventDefault();
-  // }
-
-  // 可选：阻止底部上拉溢出（如果需要）
-  // const scrollHeight = scrollContainer.scrollHeight;
-  // const clientHeight = scrollContainer.clientHeight;
-  // if (scrollTop >= scrollHeight - clientHeight && currentY < startY) {
-  //   e.preventDefault();
-  // }
-
-  startY = currentY; // 更新起始位置
-}, { passive: false }); // 必须设为false，才能触发e.preventDefault()
-}
-
-export default iosTouch;