谷歌地图 - 使ZoomControl变大

时间:2015-10-07 13:23:11

标签: google-maps

我想在地图上放置一个大型ZoomControl栏。

这是地图选项代码:

var opcjeMapy = {
    zoom: 2,
    center: wspolrzedne, // var defined in other place
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    scrollwheel: false,
    navigationControl: true,
    mapTypeControl: true,
    panControl: true,
    scaleControl: true,
    streetViewControl: true,zoomControl: true,
    overviewMapControl: false,
    streetViewControlOptions: {
        position: google.maps.ControlPosition.LEFT_TOP
    },
    zoomControlOptions: {
        style:google.maps.ZoomControlStyle.LARGE,
        position: google.maps.ControlPosition.LEFT_TOP
    }                 
};

我还有小变焦控制(+和 - )。 有人能告诉我我做错了吗?

此外(如果有人要检查它)我可以附上指向该地图页面的链接。

1 个答案:

答案 0 :(得分:0)

您正在使用当前的实验版本。在该版本中,默认情况下禁用旧控件(缩放滑块)。使用以下命令获取该版本中的旧控件:

google.maps.controlStyle = 'azteca';

related question

proof of concept fiddle

代码段

google.maps.controlStyle = 'azteca';
var geocoder;
var map;
var wspolrzedne = new google.maps.LatLng(37.4419, -122.1419);

function initialize() {
  var opcjeMapy = {
    zoom: 2,
    center: wspolrzedne, // var defined in other place
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    scrollwheel: false,
    navigationControl: true,
    mapTypeControl: true,
    panControl: true,
    scaleControl: true,
    streetViewControl: true,
    zoomControl: true,
    overviewMapControl: false,
    streetViewControlOptions: {
      position: google.maps.ControlPosition.LEFT_TOP
    },
    zoomControlOptions: {
      style: google.maps.ZoomControlStyle.LARGE,
      position: google.maps.ControlPosition.LEFT_TOP
    }
  };
  var map = new google.maps.Map(document.getElementById("map_canvas"), opcjeMapy);

  var locate = ['New York, NY', 'Newark, NJ', 'Baltimore, MD'];
  showLocation(locate);


}
google.maps.event.addDomListener(window, "load", initialize);
html,
body,
#map_canvas {
  height: 500px;
  width: 500px;
  margin: 0px;
  padding: 0px
}
<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map_canvas" style="width:750px; height:450px; border: 2px solid #3872ac;"></div>