'commit'
This commit is contained in:
@@ -22,6 +22,19 @@
|
|||||||
#contextMenu { position: absolute; display: none; background: white; border: 1px solid #ccc; padding: 5px; z-index: 9999; }
|
#contextMenu { position: absolute; display: none; background: white; border: 1px solid #ccc; padding: 5px; z-index: 9999; }
|
||||||
#deleteArrow { padding: 3px 10px; cursor: pointer; }
|
#deleteArrow { padding: 3px 10px; cursor: pointer; }
|
||||||
</style>
|
</style>
|
||||||
|
<style>
|
||||||
|
/* 新增红点样式 */
|
||||||
|
.center-dot {
|
||||||
|
position: absolute;
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
background: red;
|
||||||
|
border-radius: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
pointer-events: none;
|
||||||
|
z-index: 5;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="background-container"></div>
|
<div class="background-container"></div>
|
||||||
@@ -208,6 +221,50 @@
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
<div class="control-panel">
|
||||||
|
<div class="control-section">
|
||||||
|
<!-- 在按钮区域新增标记按钮 -->
|
||||||
|
<button class="save-btn" id="markCenterBtn">标记中心点</button>
|
||||||
|
<!-- 原有其他按钮保持不变 -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
// 新增中心点相关代码
|
||||||
|
const markCenterBtn = document.getElementById('markCenterBtn');
|
||||||
|
const backgroundContainer = document.querySelector('.background-container');
|
||||||
|
let centerDot = null;
|
||||||
|
|
||||||
|
// 标记中心点功能
|
||||||
|
markCenterBtn.addEventListener('click', function() {
|
||||||
|
// 移除旧点
|
||||||
|
if (centerDot) {
|
||||||
|
centerDot.remove();
|
||||||
|
centerDot = null;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 创建新点
|
||||||
|
function handleMapClick(e) {
|
||||||
|
const rect = backgroundContainer.getBoundingClientRect();
|
||||||
|
const x = e.clientX - rect.left;
|
||||||
|
const y = e.clientY - rect.top;
|
||||||
|
|
||||||
|
centerDot = document.createElement('div');
|
||||||
|
centerDot.className = 'center-dot';
|
||||||
|
centerDot.style.left = x + 'px';
|
||||||
|
centerDot.style.top = y + 'px';
|
||||||
|
|
||||||
|
backgroundContainer.appendChild(centerDot);
|
||||||
|
backgroundContainer.removeEventListener('click', handleMapClick);
|
||||||
|
}
|
||||||
|
|
||||||
|
backgroundContainer.addEventListener('click', handleMapClick);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 原有JavaScript代码保持不变
|
||||||
|
});
|
||||||
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
||||||
|
Reference in New Issue
Block a user