主页 / user-460114

user460114's questions

Martin Hope
user460114
Asked: 2025-04-07 23:45:09 +0800 CST
  • 5

现有代码如下，并未循环遍历 gmp-map html 元素来添加标记，而只是向其中一个元素添加标记。需要在 html 代码本身或 JavaScript 代码中使用循环。

<body>
    <cfoutput>
        <gmp-map
            center="#vLat#,#vLng#"
            zoom="10"
            map-id="DEMO_MAP_ID"
            style="height: 400px"
        >
        <cfloop query="qNearbyTradies">
            <gmp-advanced-marker
                position="#lat#,#lng#"
                title="#company_name# - #sublocality#, #locality#"
                gmpClickable=true
            ></gmp-advanced-marker>
        </cfloop>
    </cfoutput>
</body>
<script src="https://maps.googleapis.com/maps/api/js?callback=initMap&key=[KEY]&libraries=maps,marker&v=beta" async defer></script>
      
    
<script>
    async function initMap() {
        // I assume a javascript loop would begin here somewhere
        const m = document.querySelector("gmp-advanced-marker");
        m.addListener("click", ({ domEvent, latLng }) => {
            const { target } = domEvent;
            const infoWindow = new google.maps.InfoWindow;
            infoWindow.close();
            infoWindow.setContent(m.title);
            infoWindow.open(m.map, m);
        });
    }
    
    window.initMap = initMap;
</script>

我之前用 JavaScript 写了一些代码来生成公司数组，但在决定用 HTML 生成地图后，HTML 代码中已经有一个循环，如果可能的话，最好在这个循环中生成所有可点击事件。我正在寻找实现这个目标的指南。

google-maps