谷歌地图API v3:从拖动锁定区域
Google Maps API v3: lock area from dragging
我正在寻找一种方法来在Google Maps API v3中对该地区(在我的情况下:荷兰)进行边界划分,并阻止用户将地图拖到边界之外。我认为我需要的选项是在以下链接中描述的拖动(+)(结束、拖动等):https://developers.google.com/maps/documentation/javascript/reference。已经找到了很多示例,但它们似乎不适合我的代码。以下是API的javascript部分:
function initialize() {
var mapOptions = {
zoom: 1, //zoomValue
minZoom: 7, //minimumValue zoom
center: new google.maps.LatLng(52.088282, 5.477124), //position center map (geoLocation)
mapTypeControl: true, //mapType (cart/satelite)
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
position: google.maps.ControlPosition.TOP_CENTER
},
panControl: false, //panControl (moveLeft/moveUp/moveRight/moveDown)
panControlOptions: {
position: google.maps.ControlPosition.TOP_RIGHT
},
zoomControl: true, //zoomControl (zoomIn/zoomOut)
zoomControlOptions: {
style: google.maps.ZoomControlStyle.LARGE,
position: google.maps.ControlPosition.TOP_LEFT
},
scaleControl: true, //scaleControl
streetViewControl: true,
streetViewControlOptions: {
position: google.maps.ControlPosition.TOP_LEFT
}
}
var map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
}
google.maps.event.addDomListener(window, 'load', initialize);
您只需要添加
draggable: false
在选项列表中
相关文章:
- 调整窗口大小时,可拖动的对象会出现在容器外部
- 删除对HTML元素的拖动
- jQuery UI可排序-多连接列表拖动
- 禁用SVG拖动
- 旋转后拖动对象
- JQuery UI可拖动潜水与滚动棒到鼠标
- jsPlumb-拖动克隆而不进行复制
- 当我在节点上拖动鼠标时,我如何防止使用d3.ehavior.zoom().on(“缩放”,重绘)
- 如何使元素在可拖动元素内可单击
- 如何在使用Kinetic拖动同一对象后,在旋转动画中保持先前的偏移
- 在d3中拖动一条线
- 使元素在iframe中可拖动
- 通过拖动可以更改三维模型对象在Three.js场景中的位置
- 如何使所有绘制的(矩形、圆形、直线、多边形)都可拖动?纯JS
- 拖动开始时更改可拖动元素的大小
- JQuery-UI 可拖动锁定到窗口
- Phaser Box2d-在一个方向上锁定拖动
- RxJS:锁定的水平或垂直鼠标拖动
- 谷歌地图API v3:从拖动锁定区域
- 在 Chrome 中拖动时锁定鼠标光标