2

Bootstrap を使用してレスポンシブ Google マップを作成しようとしています。ここに私が今までやったことのサンプルがあります。私がする必要があるのは、ウィンドウのサイズに基づいてマップのズーム レベルを制御する方法を設定することです。たとえば、ユーザーがマップのサイズを変更すると、マップがズームアウトしてズームインし始めます。これが可能かどうか、またどのようにすればよいか教えてください。

var map;
var panorama;
jQuery(function($) {
$(document).ready(function() {
    var latlng = new google.maps.LatLng(49.241943,-122.889318);
    var myOptions = {
        zoom: 18,
        center: latlng,
        panControl: true,
        zoomControl: true,
        zoomControlOptions: {
                              style: google.maps.ZoomControlStyle.SMALL
                            },
        mapTypeControl: false,
        scaleControl: false,
        streetViewControl: false,
        overviewMapControl: true,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
       };
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    });
 });
4

1 に答える 1

2

これでマップのズームレベルを変更できます：

var mq = window.matchMedia( "(min-width: 768px)" );
if (mq.matches) {
    map.setZoom(6);
}
于 2015-10-15T12:34:41.250 に答える