diff --git a/src/components/工具组件/Ruler.jsx b/src/components/工具组件/Ruler.jsx
new file mode 100644
index 0000000..fd6eefd
--- /dev/null
+++ b/src/components/工具组件/Ruler.jsx
@@ -0,0 +1,106 @@
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { motion } from 'framer-motion';
+
+function Ruler(props) {
+ const ruler = useRef(null);
+ const [left, setLeft] = useState(props.left || '100px');
+ const [dragging, setDragging] = useState(false);
+
+ const handleUp = useCallback(() => {
+ setDragging(false);
+ }, []);
+ const handleMove = useCallback(
+ (e) => {
+ if (!dragging) return;
+ const x = e.clientX;
+ setLeft(x + 'px');
+ },
+ [dragging],
+ );
+
+ useEffect(() => {
+ document.addEventListener('mouseup', handleUp);
+ document.addEventListener('mousemove', handleMove);
+
+ return () => {
+ document.removeEventListener('mouseup', handleUp);
+ document.removeEventListener('mousemove', handleMove);
+ };
+ }, [dragging]);
+
+ function handleMouseDown() {
+ setDragging(true);
+ }
+
+ return (
+
+
+ left: {left}
+
+
+ );
+}
+
+function RulerContainer(props) {
+ const [rulers, setRulers] = useState([]);
+
+ const rulerCfg = {
+ width: '2px',
+ height: '100vh',
+ background: '#ccc',
+ };
+
+ // 监听事件
+ useEffect(() => {
+ let fn = (e) => {
+ if (e.shiftKey && e.key === 'R') {
+ setRulers((rulers) => [...rulers, rulerCfg]);
+ }
+ if (e.shiftKey && e.key === 'Q') {
+ setRulers((rulers) => []);
+ }
+ };
+
+ document.addEventListener('keydown', fn);
+ }, []);
+
+ return (
+
+ {rulers.map((ruler) => (
+
+ ))}
+
+ );
+}
+
+export default RulerContainer;
diff --git a/src/components/模块组件/窑炉内部/Center/videoComponents/Floor1To2.jsx b/src/components/模块组件/窑炉内部/Center/videoComponents/Floor1To2.jsx
index af4c6b7..30e51eb 100644
--- a/src/components/模块组件/窑炉内部/Center/videoComponents/Floor1To2.jsx
+++ b/src/components/模块组件/窑炉内部/Center/videoComponents/Floor1To2.jsx
@@ -16,15 +16,15 @@ function FloorOneToTwo(props) {
className="video-wrapper"
style={{
position: 'fixed',
- top: 0,
- left: 0,
+ top: '7px',
+ left: '50px',
width: '100%',
height: '100%',
zIndex: -998,
}}
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
- exit={{ opacity: [1, 1, 0], transition: { duration: 0.5 } }}
+ exit={{ opacity: 0, transition: { duration: 0, delay: 0.1 } }}
>