fix: canvas插入到Leaflet tilePane之后,确保在最上层渲染

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
TianXuan Developer
2026-07-25 09:12:14 +08:00
parent 5da0f2bf90
commit 569c7411b8
@@ -2753,20 +2753,34 @@ function trafficAnimate(timestamp) {
_trafficAnimId = requestAnimationFrame(trafficAnimate);
}
let _trafficLeafletLayer = null;
function _ensureTrafficCanvas() {
const container = document.getElementById('saMap');
if (!container) return null;
// Use Leaflet's internal renderer canvas for proper layering
if (!SA.map) return null;
// Access the internal canvas renderer
const pane = SA.map.getPane('overlayPane');
if (!pane) return null;
let c = document.getElementById('saTrafficCanvas');
if (!c) {
c = document.createElement('canvas');
c.id = 'saTrafficCanvas';
c.style.cssText = 'position:absolute;top:0;left:0;pointer-events:none;z-index:99999;';
container.appendChild(c);
c.width = SA.map.getSize().x; c.height = SA.map.getSize().y;
c.style.width = c.width + 'px'; c.style.height = c.height + 'px';
// Insert AFTER the Leaflet canvas (tile pane)
const tilePane = SA.map.getPane('tilePane');
if (tilePane && tilePane.parentNode) {
tilePane.parentNode.appendChild(c);
} else {
pane.appendChild(c);
}
const rect = container.getBoundingClientRect();
if (c.width !== rect.width || c.height !== rect.height) {
c.width = rect.width; c.height = rect.height;
c.style.width = rect.width + 'px'; c.style.height = rect.height + 'px';
// Resize handler
SA.map.on('resize', () => {
const s = SA.map.getSize();
c.width = s.x; c.height = s.y;
c.style.width = s.x + 'px'; c.style.height = s.y + 'px';
});
}
return c;
}