downloadUrl with file in local

0

I'm working with the Google Maps API where I upload the locations and descriptions from the server to the map. For this I have 4 files db_connect.php where I have my function that connects PHP with my MySQL database and db_gmapi that extends from db_connect.php , connects to the database, picks up the info in it and saves it in a file XML to which I have called directions.xml I finally have my index.html for the part to load the map and show the bookmarks with the locations of the file directions.xml .

The map loads, the BBDD connects perfectly, the file is generated ... but it does not show the markers because the function downloadUrl (url, callback) in mmi index.html just requires that the file directions.xml comes from a "url" file and I'm working on localhost and the file is inside the root folder along with index.html . Try sticking the path of directions.xml and file name and it did not work ... How can I resolve?

Code index.html

<!DOCTYPE html >

              

  #map {
    height: 100%;
  }

  html, body {
    height: 100%;
    margin: 0;
    padding: 0;
  }
</style>

    

<script>
  var customLabel = {
    restaurant: {
      label: 'A'
    },
    bar: {
      label: 'B'
    }
  };

    function initMap() {
    var map = new google.maps.Map(document.getElementById('map'), {
      center: new google.maps.LatLng(-33.863276, 151.207977),
      zoom: 12
    });
    var infoWindow = new google.maps.InfoWindow;

  // a continuación el problema
      downloadUrl('//directions.xml', 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 address = markerElem.getAttribute('address');
          var type = markerElem.getAttribute('type');
          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 = name
          infowincontent.appendChild(strong);
          infowincontent.appendChild(document.createElement('br'));

          var text = document.createElement('text');
          text.textContent = address
          infowincontent.appendChild(text);
          var icon = customLabel[type] || {};
          var marker = new google.maps.Marker({
            map: map,
            position: point,
            label: icon.label
          });
          marker.addListener('click', function() {
            infoWindow.setContent(infowincontent);
            infoWindow.open(map, marker);
          });
        });
      });
    }



  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() {}
</script>
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=[MI-API-KEY]&callback=initMap">
</script>

    
asked by Macali 07.12.2018 в 01:09
source

1 answer

0

I solved it with downloadUrl('http://localhost/carpetaraiz/directions.xml', function(data)

    
answered by 08.12.2018 / 17:59
source