在php中正确显示mapWindow

时间:2018-05-29 14:07:40

标签: javascript php json google-maps infowindow

如何循环关联数组的值?现在我一次只能参加一个协会!在这里,我将MySQL表格中的所有值传递给json_encode,仅使用lat& amp;只要一个数组和其他字符串的数组。谢谢

function myMap() {

  var infowindow = new google.maps.InfoWindow();

  var mapOptions = {
      zoom: 5,
      center: new google.maps.LatLng(44.849716, 10.052282),
      mapTypeId: 'roadmap',
      styles: []
  };

  var i = 0;
  var mapElement = document.getElementById('map');
  var map = new google.maps.Map(mapElement, mapOptions);
  var markers = <?= json_encode($this->getCoordinatesMaps[0]); ?>; //Passing the PHP values to JS


  var marker, i;
  //Add marker to map
  for(var i in markers) {
      var marker = markers[i];
      var marker = new google.maps.Marker({
          position: new google.maps.LatLng(marker.lat, marker.long),
          map: map,
          title: 'Niente',
          clickable: true
      });


      google.maps.event.addListener(marker, 'click', (function(marker, i) {
                    return function() {
                        infowindow.setContent(<?= json_encode($this->getCoordinatesMaps[0]->comune); ?> + ' - ' + <?= json_encode($this->getCoordinatesMaps[0]->mansione_tecnica); ?>);
                        infowindow.open(map, marker);
                    }
                })(marker, i));
      }
  }

2 个答案:

答案 0 :(得分:1)

setContent方法需要一个字符串。您正在传递多个参数

infowindow.setContent(markers[i].lat, markers[i].long);

正确的方法应该是: infowindow.setContent('My content here');

答案 1 :(得分:1)

这是我上一个问题的解决方案。也许可以帮助某人尝试做同样的事情。然后我还添加一个GET表单,以便轻松更改您在全球范围内看到工作人员的日期。 :)

function myMap() {

    var infowindow = new google.maps.InfoWindow();

    var mapOptions = {
        zoom: 5,
        center: new google.maps.LatLng(44.849716, 10.052282),
        mapTypeId: 'roadmap',
        styles: []
    };

    var mapElement = document.getElementById('map');
    var map = new google.maps.Map(mapElement, mapOptions);

    var markersArray = '<?= json_encode($this->getCoordinatesMaps); ?>';//Passing the PHP values to JS
    markers = JSON.parse(markersArray); //Reading array values
    // console.log(markers[1].comune);

    var marker, i; //Defining this function for infoWindow

    for (var i = 0; i < markers.length; i++) {
    // console.log(markers[i].latlng.lat + ' is a ' + markers[i].latlng.long + '.');
    var marker = markers[i];
    var marker = new google.maps.Marker({
        position: new google.maps.LatLng(markers[i].latlng.lat, markers[i].latlng.long),
        map: map,
        title: markers[i].surname + ' ' + markers[i].name,
        animation: google.maps.Animation.DROP,
        clickable: true
    });

    google.maps.event.addListener(marker, 'click', (function(marker, i) {
          return function() {
              infowindow.setContent("<div><img width='120' height='30' src='/images/logo.png'</div><hr />" + '<strong>Address: </strong> ' + markers[i].address + ' <strong>Event Name: </strong> ' + markers[i].event_name  + ' <strong>Worker: </strong> ' + markers[i].name+ ' ' + markers[i].surname + ' <strong>Work: </strong> ' + markers[i].technical_work + ' <strong>Client: </strong>' + markers[i].client_name);
              infowindow.setOptions({maxWidth: 300});
              infowindow.open(map, marker);
          }
      })(marker, i));
    }

}