Google Maps Api Polylines - PullRequest
Новая
       37

Google Maps Api Polylines

0 голосов
/ 29 ноября 2018

Так что я новичок в API карт Google, и я уже могу добавлять маркеры на карту, но ... я действительно хочу добавить полилинии, соединяющие все маркеры вместе из моего массива маркеров. Я пытаюсьполучить этот эффект, но без необходимости щелкать mouseBtn, я хочу добавить полилинии, чтобы соединить различные точки интереса из моего массива маркеров.я бы в конечном итоге получил эти данные из моей базы данных, так как бы мне соединить точки.https://developers.google.com/maps/documentation/javascript/examples/polyline-complex

<script>
    function initMap(){

        // Map Options Var
        var options = {
            zoom: 2,
            center:{lat:1.088199,lng:-14.801055} 
        }

        // New Map Var
        var map = new 
        google.maps.Map(document.getElementById('map'), options);


        // Marker Labels Var
        var labels = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
        var labelIndex = 0;


        // Array of Markers
        var markers = [
        // Marker With Custom Icon
        {coords:{lat:17.630215, lng:-63.230534},iconImage: 'https://pbs.twimg.com/profile_images/874276197357596672/kUuht00m_bigger.jpg'},

        // Marker Without Custom Icon
        {coords:{lat:23.417468, lng:-102.812094},content: '<h1>ThiS One Has A InfoWindow!</h1>'},

        // Regular Marker Without Custom Icon
        {coords:{lat:49.785305, lng:10.446137}}
        ]


        // Loop Through Markers
        for(var i = 0; i < markers.length; i++){
            // Add Marker
            addMarker(markers[i]);
        }

примеры из Google не работают или, кажется, не работают для меня ... 

 // Add Marker Function
        function addMarker(props){
            var marker = new google.maps.Marker({
                position:props.coords,
                label: labels[labelIndex++ % labels.length],
                map: map,
                animation: google.maps.Animation.DROP,
                //icon:props.iconImage
            });


            // Check For Custom Icon
            if (props.iconImage){
                // Set Icon Image
                marker.setIcon(props.iconImage);
            }


            // Check For Marker InfoWindow Content
            if (props.content){
                // Marker Info Window Var
                var infoWindow = new google.maps.InfoWindow({
                    content: props.content
                });


                // Listens For Clicks On Marker
                marker.addListener('click',  function(){
                    infoWindow.open(map, marker);
                });
            }
        } 
    }
</script>
...