使用Google Maps API,如何使用当前缩放级别的所有可见标记填充html表

时间:2018-07-24 07:12:49

标签: javascript jquery html css google-maps

我有一个空的html表和带有一些标记的google map。所有标记都存储在一个数组中。 当用户放大地图时,标记位置应填满空白表格。 那么,我将如何实现呢?

enter image description here

        <div id="MapRender"></div>


            <table>
                <thead>
                    <tr>
                        <th>Location</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td></td>
                    </tr>
                </tbody>
            </table>


    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=xxxxxxxxx"></script>  

    <script type="text/javascript">
    function LoadGoogleMAP() {

        var mapProp = {
            zoom: 4,
            center: myLatLng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(document.getElementById('MapRender'), mapProp);

        var marker = new google.maps.Marker({
            position: new google.maps.LatLng(23.592360,76.733660),
            map: map,
            optimized: false,
            title: 'Place1'
        })

        var marker1 = new google.maps.Marker({
            position: new google.maps.LatLng(22.174507, 88.777137),
            map: map,
            optimized: false,
            title: 'Place2'
        })
    }
    google.maps.event.addDomListener(window, 'load', LoadGoogleMAP);

</script>

0 个答案:

没有答案