Question

人

我在HTML页面中有以下代码。它显示了带有自定义标记的Google地图，并且到目前为止，everithing工作正常：



<html>

<head>
    <meta charset="utf-8">
    <title>Ejemplito</title>
<style>
  #map_canvas {
    width: 600px;
    height: 300px;
    background-color: #CCC;
  }
</style>
<script src="scripts/jquery.min.js" type="text/javascript"></script> 
<script src="https://maps.googleapis.com/maps/api/js"></script>

<script>
function addMarker(titulo, pos, iconName, mapa) {
  var marker = new google.maps.Marker({
    map: mapa,
    position: pos,
    icon: iconName,
    title: titulo
  });
}
function init(container, x, y, zoom) {        
  map_canvas = document.getElementById(container);
  var map_options = {
    center: new google.maps.LatLng(x, y),
    zoom: zoom,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
  panControl: false,
  zoomControl: true,
  mapTypeControl: false,
  scaleControl: false,
  streetViewControl: false,
  overviewMapControl: false
  }
  var map = new google.maps.Map(map_canvas, map_options);
  addMarkers(map);
}
</script>




<script>
var map_canvas = document.getElementById('map_canvas');
var icon = 'https://cdn1.iconfinder.com/data/icons/Webtoys/64/Pin.png';

function addMarkers(mapa) {
  var pos1 = new google.maps.LatLng(19.2887395,-99.198382,14);
  addMarker('Primer marcador', pos1, icon, mapa);

  var pos2 = new google.maps.LatLng(19.2792758,-99.2334069,14);
  addMarker('Segundo pin', pos2, icon, mapa);
}

$(function() {
  init('map_canvas',19.2792608,-99.2334009,13);
});
</script>

</head>


<body>
  <h1>Hola</h1>
  <div id="map_canvas"></div>
</body>


</html>

<html> <head> <meta charset="utf-8"> <title>Ejemplito</title> <style> #map_canvas { width: 600px; height: 300px; background-color: #CCC; } </style> <script src="scripts/jquery.min.js" type="text/javascript"></script> <script src="https://maps.googleapis.com/maps/api/js"></script> <script> function addMarker(titulo, pos, iconName, mapa) { var marker = new google.maps.Marker({ map: mapa, position: pos, icon: iconName, title: titulo }); } function init(container, x, y, zoom) { map_canvas = document.getElementById(container); var map_options = { center: new google.maps.LatLng(x, y), zoom: zoom, mapTypeId: google.maps.MapTypeId.ROADMAP, panControl: false, zoomControl: true, mapTypeControl: false, scaleControl: false, streetViewControl: false, overviewMapControl: false } var map = new google.maps.Map(map_canvas, map_options); addMarkers(map); } </script> <script> var map_canvas = document.getElementById('map_canvas'); var icon = 'https://cdn1.iconfinder.com/data/icons/Webtoys/64/Pin.png'; function addMarkers(mapa) { var pos1 = new google.maps.LatLng(19.2887395,-99.198382,14); addMarker('Primer marcador', pos1, icon, mapa); var pos2 = new google.maps.LatLng(19.2792758,-99.2334069,14); addMarker('Segundo pin', pos2, icon, mapa); } $(function() { init('map_canvas',19.2792608,-99.2334009,13); }); </script> </head> <body> <h1>Hola</h1> <div id="map_canvas"></div> </body> </html>

然而，当我在地图上移动鼠标滚轮时，它会执行缩放（输出/输入），我需要禁用此类行为。

我的问题是：我的html页面中应该更改/添加哪些代码（行，如果可能），以禁用此类行为？

比你多！

Answer 1

地图选项中的

： scrollwheel：false。 https://developers.google.com/maps/documentation/javascript/reference#ZoomControlOptions

禁用Google地图上的默认行为

1 个答案: