diff --git a/dsLightRag/ChangZheng/1.html b/dsLightRag/ChangZheng/1.html
index 50fc1710..3ac97b50 100644
--- a/dsLightRag/ChangZheng/1.html
+++ b/dsLightRag/ChangZheng/1.html
@@ -117,30 +117,25 @@
// 获取SVG路径的总长度
const pathLength = route.getTotalLength();
- // 计算SVG坐标系到页面坐标系的转换比例
- function getScaleFactor() {
- const viewBox = route.viewBox.baseVal;
- const svgRect = route.closest('svg').getBoundingClientRect();
- return {
- x: svgRect.width / viewBox.width,
- y: svgRect.height / viewBox.height
- };
- }
-
// 根据进度百分比获取路径上的点
function getPointOnPath(percent) {
const distance = percent * pathLength / 100;
const point = route.getPointAtLength(distance);
- const scale = getScaleFactor();
- // 获取SVG元素相对于页面的位置
- const svgRect = route.closest('svg').getBoundingClientRect();
+ // 将SVG坐标转换为页面坐标
+ const svgPoint = route.ownerSVGElement.createSVGPoint();
+ svgPoint.x = point.x;
+ svgPoint.y = point.y;
+
+ const matrix = route.ownerSVGElement.getScreenCTM();
+ const transformedPoint = svgPoint.matrixTransform(matrix);
+
+ // 转换为相对于#map容器的坐标
const mapRect = map.getBoundingClientRect();
- // 计算红旗在页面上的位置
return {
- x: svgRect.left - mapRect.left + point.x * scale.x,
- y: svgRect.top - mapRect.top + point.y * scale.y
+ x: transformedPoint.x - mapRect.left,
+ y: transformedPoint.y - mapRect.top
};
}