diff --git a/frontend/src/components/PermissionIpLocations.test.ts b/frontend/src/components/PermissionIpLocations.test.ts index 1baafc2f..ed1ba034 100644 --- a/frontend/src/components/PermissionIpLocations.test.ts +++ b/frontend/src/components/PermissionIpLocations.test.ts @@ -47,11 +47,12 @@ describe("PermissionIpLocations", () => { expect(source).not.toContain('all: "近 90 天"'); }); - it("keeps fullscreen animation sharp without multiplying large canvas layers", () => { + it("keeps fullscreen animation sharp without dirty-rect artifacts or extra canvas layers", () => { const source = readSource(); expect(source).toContain('v-if="!fullscreenVisible"'); - expect(source).toContain("useDirtyRect: true"); + expect(source).toContain("useDirtyRect: false"); + expect(source).not.toContain("useDirtyRect: true"); expect(source).toContain("Math.min(getDevicePixelRatio(), 2)"); expect(source).not.toContain("getDevicePixelRatio() * 1.5"); expect(source).not.toContain("zlevel:"); diff --git a/frontend/src/components/PermissionIpLocations.vue b/frontend/src/components/PermissionIpLocations.vue index 959d1793..2be0fe97 100644 --- a/frontend/src/components/PermissionIpLocations.vue +++ b/frontend/src/components/PermissionIpLocations.vue @@ -223,8 +223,9 @@ const mapLoadError = ref(""); const mapReady = ref(false); const lastUpdatedAt = ref(null); const getDevicePixelRatio = () => (typeof window === "undefined" ? 1 : window.devicePixelRatio || 1); -const chartInitOptions = { devicePixelRatio: Math.min(getDevicePixelRatio(), 2), useDirtyRect: true }; -const fullscreenChartInitOptions = { devicePixelRatio: Math.min(getDevicePixelRatio(), 2), useDirtyRect: true }; +// Animated lines/effectScatter leave cleared rectangles over the geo layer when dirty-rect rendering is enabled. +const chartInitOptions = { devicePixelRatio: Math.min(getDevicePixelRatio(), 2), useDirtyRect: false }; +const fullscreenChartInitOptions = { devicePixelRatio: Math.min(getDevicePixelRatio(), 2), useDirtyRect: false }; const chartUpdateOptions = { notMerge: true }; const chartAutoresize = { throttle: 120 }; const fullscreenVisible = ref(false);