2017-05-26 6 views
0

モバイルデバイスでブラウズしてGoogleマップを無効にする場合は、ブラウザウィンドウが600px以下の場合、現在divを非表示にするCSSを実行しています。Google Maps API 3 - モバイルの場合は無効にする

@media only screen and (max-width: 600px) { 
    .mapCanvas { 
     display: none; 
    } 
} 

ブラウザが600px以下の場合、JSがGoogle Maps APIにクエリを実行しないようにするにはどうすればよいですか?

地図が表示されていないときにAPIサーバーに照会しないようにします。

<div id="mapCanvas"></div> 
<script> 
    function initMap() { 
     var map; 
     var bounds = new google.maps.LatLngBounds(); 
     var mapOptions = { 
      mapTypeId: 'roadmap' 
     }; 

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

     // Multiple markers location, latitude, and longitude 
     var markers = [ <?php echo $js_markers; ?> 

     ]; 

     // Info window content 
     var infoWindowContent = [ <?php echo $js_content; ?> 

     ]; 

     // Add multiple markers to map 
     var infoWindow = new google.maps.InfoWindow(), marker, i; 

     // Place each marker 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] 
      }); 

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

      // Center the map to fit all markers on the screen 
      map.fitBounds(bounds); 
     } 

     // Set zoom level 
     var boundsListener = google.maps.event.addListener((map), 'bounds_changed', function(event) { 
      this.setZoom(7); 
      google.maps.event.removeListener(boundsListener); 
     }); 

    } 
// Load initialize function 
google.maps.event.addDomListener(window, 'load', initMap); 
</script> 
<script async defer src="https://maps.googleapis.com/maps/api/js?key=???&callback=initMap"></script> 

答えて

0

if (typeof window.orientation !== 'undefined') { ... } 
のようなその携帯

何かあれば、GoogleマップAPI JSファイルが含まれていません。

関連する問題