2017-05-03 7 views
0

私は問題があります。これはGoogleマップのJavaScriptコードです。私はマーカーの名前と説明を追加したい、その意志はマウスのホバー効果で示した。 ThanksaGoogleメーカーの地図の名前と説明を追加するには

<script> 
     var map; 
     function initMap() { 
     map = new google.maps.Map(document.getElementById('map'), { 
      zoom: 15, 
      center: new google.maps.LatLng(-33.91722, 151.23064), 
      mapTypeId: 'roadmap' 
     }); 
     var icons = { 
      parking: { 
      icon: 'icon32.png' 
      } 
     }; 
     var features = [ 
      { 
      position: new google.maps.LatLng(-33.91721, 151.22630), 
      type: 'parking' 
      }, { 
      position: new google.maps.LatLng(-33.91539, 151.22820), 
      type: 'parking' 
      } 
     ]; 
     // Create markers. 
     features.forEach(function(feature) { 
      var marker = new google.maps.Marker({ 
      position: feature.position, 
      icon: icons[feature.type].icon, 
      map: map 
      }); 
     }); 
     } 
    </script> 

答えて

0

あなたは目標を達成するために、この変更されたコードを使用する必要があります。

<script> 
    var infowindows = []; 
    var map; 
    var Markers = [ 
     ['Palace of Westminster', 'London', '51.499332, -0.124659'], 
     ['Tower Bridge', 'London', '51.505396, -0.075432'], 
    ]; 
    function initMap() { 
     map = new google.maps.Map(document.getElementById('map'), { 
      zoom: 15, 
      center: new google.maps.LatLng(51.485570, -0.129103), 
      mapTypeId: 'roadmap' 
     }); 
     var icons = { 
      parking: { 
       icon: 'icon32.png' 
      } 
     }; 

     // Create markers. 
     for (var i=0; i<Markers.length; i++) { 
      var contentString = '<div class="infoWindow"><strong>' + Markers[i][0] + '<\/strong>' + 
       '<br>' + Markers[i][1] + '<\/div>'; 
      var infowindow = new google.maps.InfoWindow({ 
       content: contentString 
      }); 

      latLngString = Markers[i][2]; 
      latLngString = latLngString.replace("(",""); 
      latLngString = latLngString.replace(")",""); 
      latLngString = latLngString.trim();   

      var lat = latLngString.split(",")[0].trim(); 
      var lng = latLngString.split(",")[1].trim(); 
      var latLng = new google.maps.LatLng(lat, lng); 

      var marker = new google.maps.Marker({ 
       map: map, 
       position: latLng, 
       icon: icons[parking].icon,    
      }); 
      google.maps.event.addListener(marker, 'mouseover', function() { 
       infowindow.open(map, marker); 
      }); 
      google.maps.event.addListener(marker, 'mouseout', function() { 
       infowindow.close(map, marker); 
      }); 
      infowindows.push(infowindow); 
     } 
    } 
</script> 

アレイマーカーを名前、場所と地図上に置くために、各マーカーの座標上の情報が含まれています。マーカーを編集して地図上にマーカーを配置します。

+0

あなたのコードをありがとう。 foreachなしでこれを追加できますか? ['Westminsterの宮殿、ロンドン'、-33.840282,151.207474] – Sakib

+0

私はそれに応じて答えを書き直しました。 –

関連する問題