2015-07-27 2 views
1

Я использую V3 API Карт Google для отображения карты с несколькими маркерами. Все отлично работает на устройствах, не связанных с сетчаткой, но на сетчатых устройствах плитки искажаются, и они выглядят так, как будто маркеры отображаются в неправильных местах.Неверная картинка карты Google на сетчатке

Скриншот на Non-Retina (правильный) Screenshot on Non-Retina (correct)

Скриншот на сетчатке (не правильное) Screenshot on Retina (not correct)

Вот код:

jQuery(function($) { 
     // Asynchronously Load the map API 
     var script = document.createElement('script'); 
     script.src = "https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&callback=initialize_map&key=<?php echo GOOGLE_MAPS_API_KEY; ?>"; 
     document.body.appendChild(script); 
    }); 

    function initialize_map() { 
     var map; 
     var bounds = new google.maps.LatLngBounds(); 
     var mapOptions = { 
     mapTypeId: 'roadmap' 
     }; 

     // Display a map on the page 
     map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); 

     var markers = [['Dublin Ohio', 40.09316, -83.13382000000001], ['Boston, Massachusetts 02135', 42.340233, -71.15995900000001]]; 
     var infoWindowContent = [['<div class="info_content"><h5>Dublin</h5><p>Description here</p></div>'], ['<div class="info_content"><h5>Boston</h5><p>Description here</p></div>']]; 

     // Display multiple markers on a map 
     var infoWindow = new google.maps.InfoWindow(), 
      marker, i; 

     // Loop through our array of markers & place each one on the map 
     for (i = 0; i < markers.length; i++) { 
     var position = new google.maps.LatLng(markers[i][1], markers[i][2]); 
     bounds.extend(position); 
     marker = new google.maps.Marker({ 
      position: position, 
      map: map, 
      title: markers[i][0] 
     }); 

     // Allow each marker to have an info window 
     google.maps.event.addListener(marker, 'click', (function(marker, i) { 
      return function() { 
      infoWindow.setContent(infoWindowContent[i][0]); 
      infoWindow.open(map, marker); 
      } 
     })(marker, i)); 

     // Automatically center the map fitting all markers on the screen 
     map.fitBounds(bounds); 
     } 
    } 
+0

Вам нужно добавить конкретную функцию для отображения изображений с правильным разрешением @ 2x для дисплеев сетчатки? – Petruza

+0

№ Проблема возникла, когда я изменил версию api с 'v = 3.exp' на' v = 3.0' – Will

ответ

3

Ответ был явно использовать Google Maps Версия 3.0 вместо 3.exp.

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