2014-09-02 2 views
0

Я пытаюсь отобразить карту google с маркерами и кругами. Карта и круг отображаются правильно, но маркер не отображается на карте.Маркеры не отображаются на карте google

Пожалуйста, представьте, какие изменения я должен внести в свой код.

<div id="mapview" style="width: 100%; height: 700px;"> 
</div> 
<script> 
    var map; 
    var info_window; 
    function initialize() { 
     var mapOptions = { 
      zoom: 11, 
      center: new google.maps.LatLng(51.561918, -0.31237799999996696), 
      mapTypeId: google.maps.MapTypeId.ROADMAP, scrollwheel: false 
     }; 
     map = new google.maps.Map(document.getElementById('mapview'), mapOptions); 
     var image = '../Image/salemarker.png'; 
     var user = new google.maps.Marker({ 
      map: map, 
      position: new google.maps.LatLng(51.561918, -0.31237799999996696), 
      animation: google.maps.Animation.DROP, icon: image 
     }); 
     var circle = new google.maps.Circle({ 
      map: map, 
      radius: 1609.344, // 10 miles in metres 
      strokeColor: '#08355A;', 
      strokeOpacity: 0.8, 
      strokeWeight: 2, 
      fillColor: '#fffff', 
      fillOpacity: 0.2, 
     }); 
     info_window = new google.maps.InfoWindow({ 
      content: 'loading' 
     }); 
     user.setMap(null); 
     function addMarkersc() { 
      createLocationOnMap('4 bed semi detached For sale', new google.maps.LatLng(51.5661728, 51.5661728), '<p>48, The fairway, wembley, HA..</p>'); 
     } 
     addMarkersc(); 
     circle.bindTo('center', user, 'position'); 
     map.fitBounds(circle.getBounds()); 
    } 
    google.maps.event.addDomListener(window, 'load', initialize); 
    var image1 = '../Image/salemarker.png'; 
    function createLocationOnMap(titulo, posicao, conteudo) { 
     var m = new google.maps.Marker({ 
      map: map, 
      title: titulo, 
      icon: image1, 
      position: posicao, 
      html: conteudo 
     }); 
     google.maps.event.addListener(m, 'mouseover', function() { 
      info_window.setContent(this.html); 
      info_window.open(map, this); 
     }); 
    } 
</script> 

ответ

1

Вы можете попробовать это

function InitializeMap1() { 
    geocoderMap = new google.maps.Geocoder(); 
    var latlng = new google.maps.LatLng(48.856614, 2.352222); 
    var myOptions = 
    { 
     zoom: 12, 
     minZoom: 12, // panControl: false, zoomControl: false, scaleControl: false, streetViewControl: true, // 
     center: latlng, 
     streetViewControl: false, 
     scaleControl: true, 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     disableDefaultUI: true, 
     zoomControl: true 
    }; 
    map = new google.maps.Map(document.getElementById("map"), myOptions); 
    var arrayMain = []; 
    var markerLatLng = new google.maps.LatLng(48.856614, 2.352222); 
    var marker = new google.maps.Marker({ 
     map: map, 
     position: markerLatLng, 
     center: markerLatLng 
    }); 
    arrayMain.push(marker); 
} 
1

Попробуйте так:

<div id="mapview" style="width: 100%; height: 700px">  
<script> 
    var map; 
    var info_window; 
    function addMarkersc() { 
     var titulo = '4 bed semi detached For sale'; 
     var posicao = new google.maps.LatLng(51.5661728,51.5661728); 
     var conteudo = '<p>48, The fairway, wembley, HA..</p>'; 
     var image = '../Image/salemarker.png'; 
     var m = new google.maps.Marker({ 
      map: map, 
      title: titulo, 
      icon: image, 
      position: posicao, 
      html: conteudo 
     });  
     google.maps.event.addListener(m, 'mouseover', function() { 
      info_window.setContent(this.html); 
      info_window.open(map, this); 
     }); 
    } 
    function initialize() { 
     var mapOptions = { 
      zoom: 11, 
      center: new google.maps.LatLng(51.561918,-0.31237799999996696), 
      mapTypeId: google.maps.MapTypeId.ROADMAP,scrollwheel: false 
     }; 
     map = new google.maps.Map(document.getElementById('mapview'),mapOptions); 
     var image = '../Image/salemarker.png'; 
     var user = new google.maps.Marker({ 
      map: map, 
      position: new google.maps.LatLng(51.561918,-0.31237799999996696), 
      animation: google.maps.Animation.DROP, 
      icon: image 
     }); 
     var circle = new google.maps.Circle({ 
      map: map, 
      radius: 1609.344, // 10 miles in metres 
        strokeColor: '#08355A;', 
        strokeOpacity: 0.8, 
        strokeWeight: 2, 
        fillColor: '#fffff', 
        fillOpacity: 0.2, 
     }); 
     info_window = new google.maps.InfoWindow({ 
      content: 'loading' 
     }); 
     user.setMap(null); 
     circle.bindTo('center', user, 'position'); 
     map.fitBounds(circle.getBounds()); 
     addMarkersc(); 
    } 
    google.maps.event.addDomListener(window, 'load', initialize); 
</script> 
+0

это уже есть функция addMarkersc() { createLocationOnMap ('4-х спальная отдельностоящая продажа', новый г oogle.maps.LatLng (51.5661728,51.5661728), '

48, фарватер, волейбол, HA ..

');} addMarkersc(); –

2

Ваш маркер находится вне поля зрения. Именно в 51.5661728,51.5661728:

createLocationOnMap('4 bed semi detached For sale', new google.maps.LatLng(51.5661728,51.5661728), '<p>48, The fairway, wembley, HA..</p>');} 

Ваша карта центрируется на 51.561918, -0,31237799999996696

var mapOptions = { 
    zoom: 11, 
    center: new google.maps.LatLng(51.561918,-0.31237799999996696), 
    mapTypeId: google.maps.MapTypeId.ROADMAP,scrollwheel: false 
}; 

working fiddle

Смежные вопросы