如何用折线连接标记?

时间:2019-11-13 00:47:20

标签: javascript api maps

如何将标记与一条线连接?标记是由XML文件生成的。

我需要不断更新和下载XML文件的位置,并且它将标记与一行绑定在一起。 数据是实时输出的,因此我需要在标记通过的地方标记行。

我正在使用Google默认代码从XML文件添加书签

var histMapLink = "<?php echo "$history_map$placa" ?>";       
var map;
var infoWindow;

function initMap() {
  var map = new google.maps.Map(document.getElementById('map'), {
    center: new google.maps.LatLng(-22.894294, -43.218077),
    zoom: 11,
    //mapTypeId: 'hybrid',
    });

    var infoWindow = new google.maps.InfoWindow;
    // Change this depending on the name of your PHP or XML file

    function refresh() {

        setInterval(function () {

            downloadUrl(histMapLink,
                function (data) {

                    var xml = data.responseXML;
                    var markers = xml.documentElement.getElementsByTagName('marker');

                    Array.prototype.forEach.call(markers, function (markerElem) {
                        var id = markerElem.getAttribute('id');
                        var name = markerElem.getAttribute('name');
                        var speed = markerElem.getAttribute('speed');
                        var placa = markerElem.getAttribute('placa');
                        var address = markerElem.getAttribute('address');
                        var type = markerElem.getAttribute('type');
                        var uptime = markerElem.getAttribute('uptime');
                        var status = markerElem.getAttribute('status');
                        var destino = markerElem.getAttribute('destino');
                        var point = new google.maps.LatLng(
                            parseFloat(markerElem.getAttribute('lat')),
                            parseFloat(markerElem.getAttribute('lng')));


                        var infowincontent = document.createElement('div');
                        var strong = document.createElement('strong');
                        strong.textContent = "Motorista: " + name
                        infowincontent.appendChild(strong);

                        infowincontent.appendChild(document.createElement('br'));
                        var text = document.createElement('text');
                        text.textContent = "Local atual: " + address
                        infowincontent.appendChild(text);


                        var icon = customLabel[type] || {};


                        var marker = new google.maps.Marker({
                          map: map,
                          position: point,
                          //label: icon.label,
                          title: name + " - " + type,
                          //icon: iconBase + 'marker.png'
                          icon: icon.icon
                          });


                        marker.addListener('click', function () {
                            infoWindow.setContent(infowincontent);
                            infoWindow.open(map, marker);
                            //map.setZoom(map.zoom + 2);
                            map.setCenter(marker.getPosition());
                        });




                        //----------------start reload markers;

                        var call = setInterval(function(){
                          marker.setMap(null);
                          marker.setMap(initMap);
                        }, 5800);

                        //----------------end reload markers;


                    });
                });

        }, 3000);
    }

    refresh();

}



function downloadUrl(url, callback) {
    var request = window.ActiveXObject ?
        new ActiveXObject('Microsoft.XMLHTTP') :
        new XMLHttpRequest;


    request.onreadystatechange = function () {
        if (request.readyState == 4) {
            request.onreadystatechange = doNothing;
            callback(request, request.status);
        }
    };

    request.open('GET', url, true);
    request.send(null);
};

function doNothing() {}

0 个答案:

没有答案