From 71acd3814b7466717d7cd4d4680cb4457c5246da Mon Sep 17 00:00:00 2001 From: "WRSNDM\\Administrator" Date: Wed, 14 May 2025 17:07:28 +0800 Subject: [PATCH] no message --- web/src/pages/Edit/components/Navigator.vue | 9 ++++++++ .../mind-map/src/components/MindMap.vue | 21 +++++++------------ 2 files changed, 17 insertions(+), 13 deletions(-) diff --git a/web/src/pages/Edit/components/Navigator.vue b/web/src/pages/Edit/components/Navigator.vue index fe5424a6..6dcf4258 100644 --- a/web/src/pages/Edit/components/Navigator.vue +++ b/web/src/pages/Edit/components/Navigator.vue @@ -148,6 +148,15 @@ export default { getImgUrl(img => { this.mindMapImg = img }) + + console.log('viewBoxStyle', { + getImgUrl, + viewBoxStyle, + miniMapBoxScale, + miniMapBoxLeft, + miniMapBoxTop + }) + this.viewBoxStyle = viewBoxStyle this.svgBoxScale = miniMapBoxScale this.svgBoxLeft = miniMapBoxLeft diff --git a/web3/packages/mind-map/src/components/MindMap.vue b/web3/packages/mind-map/src/components/MindMap.vue index fc3831bc..d823ef01 100644 --- a/web3/packages/mind-map/src/components/MindMap.vue +++ b/web3/packages/mind-map/src/components/MindMap.vue @@ -9,7 +9,6 @@ const mindMapStore = useMindMapStore(); const { getMindMapInstance } = mindMapStore; const { isDark, showMiniMap } = storeToRefs(mindMapStore); -// 使用防抖函数处理画布更新 const debouncedDrawMiniMap = debounce( () => { drawMiniMap(); @@ -24,7 +23,6 @@ const debouncedSetSize = debounce( width.value = Math.min(window.innerWidth - 80, 370); nextTick(() => { if (showMiniMap.value && navigatorBoxRef.value) { - init(); drawMiniMap(); } }); @@ -34,12 +32,11 @@ const debouncedSetSize = debounce( ); const svgBoxScale = ref(1); - const svgBoxLeft = ref(0); const svgBoxTop = ref(0); const viewBoxStyle = ref({ - left: "0px", // 确保初始值为字符串以匹配后续更新 + left: "0px", top: "0px", bottom: "0px", right: "0px", @@ -96,11 +93,9 @@ function drawMiniMap() { if (!calculationResult) return; - console.log("calculationResult", calculationResult); - const { getImgUrl, - viewBoxStyle: newViewBoxStyle, + viewBoxStyle: __viewBoxStyle, miniMapBoxScale, miniMapBoxLeft, miniMapBoxTop, @@ -111,7 +106,7 @@ function drawMiniMap() { mindMapImg.value = img; }); - viewBoxStyle.value = newViewBoxStyle; + viewBoxStyle.value = __viewBoxStyle; svgBoxScale.value = miniMapBoxScale; svgBoxLeft.value = miniMapBoxLeft; svgBoxTop.value = miniMapBoxTop; @@ -202,7 +197,8 @@ function onViewBoxPositionChange({ viewBoxStyle.value.bottom = bottom; } -onMounted(() => { +onMounted(async () => { + await init(); setSize(); window.addEventListener("resize", setSize); window.addEventListener("mouseup", onMouseup); @@ -234,9 +230,9 @@ onUnmounted(() => { @mousedown="onMousedown" @mousemove="onMousemove" > - svgBoxScale:{{ svgBoxScale }} +
{ .svgBox { position: absolute; left: 0; - top: 0; transform-origin: left top; } .windowBox { position: absolute; - border: 2px solid #ee4545; + border: 2px solid rgb(238, 69, 69); background-color: rgba(238, 69, 69, 0.2); &.withTransition {