jquery-ui-map 如何设置缩放级别
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9375858/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jquery-ui-map how to set zoom level
提问by stef
I have the following code working fine, but I'm unable to add a zoom level. According to the docsit should work with 'option', 'zoom', 7but this gives an error: "$("#map_canvas").gmap("option", "zoom", 7).bind is not a function"
我有以下代码工作正常，但我无法添加缩放级别。根据它应该使用的文档，'option', 'zoom', 7但这给出了一个错误："$("#map_canvas").gmap("option", "zoom", 7).bind is not a function"
Working code, sans zoom, edited. Zoom is always at 1.
工作代码，无缩放，已编辑。缩放始终为 1。
$("#map_trigger").click(function(){
var prop_id = $("#map_canvas").attr("rel");
$('#map_canvas').gmap({'zoom':6}).bind('init', function(evt, map) {
$.getJSON( basepath+'properties/get_gps_coords/'+prop_id, function(data) {
$.each( data.markers, function(i, m) {
lat = m.latitude;
longitude = m.longitude;
$('#map_canvas').gmap(
'addMarker', { 'position': new google.maps.LatLng(lat, m.longitude), 'bounds':true }
);
});
});
});
});
How can I add a zoom level to this snippet?
如何向此代码段添加缩放级别？
回答by jcalonso
This code works for me:
这段代码对我有用：
<!doctype html>
<html>
<head>
<meta http-equiv="content-language" content="es">
<meta charset="utf-8">
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="js/jquery-1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="../ui/jquery.ui.map.js"></script>
</head>
<body>
<div style="height: 500px; width:500px;" id="map_canvas"></div>
<button id="btnChangeZoom">change zoom</button>
<script type="text/javascript">
$(function() {
$('#map_canvas').gmap({ 'center': '40.33238,-3.76546','scrollwheel':false});
$('#map_canvas').gmap('option', 'mapTypeId', google.maps.MapTypeId.SATELLITE);
$('#map_canvas').gmap('option', 'zoom', 17);
});
$("#btnChangeZoom").click(function(){changeZoom()});
function changeZoom(){
$('#map_canvas').gmap('option', 'zoom', 10);
}
</script>
</body>
</html>
回答by Dr.Molle
Use:
用：
$("#map_canvas").gmap({'zoom':7})
The option-method can be used when the map is already initialized and will not return a jQuery-object, so it's not chainable(what will explain the error you got).
当地图已经初始化并且不会返回 jQuery 对象时，可以使用 option-method，因此它不可链接（这将解释您遇到的错误）。
回答by George Plamenov Georgiev
Yo need to center the map and then zoom it. Here is a sample of code
你需要将地图居中，然后缩放它。这是代码示例
$('#map_canvas').gmap({'center': '43.1502, 25.02083'})
$('#map_canvas').gmap('option', 'zoom', 10);
$('#map_canvas').gmap('addMarker', {'position': '43.1502, 25.02083', 'icon': '/picnic/img/Pin.png'}).click(function() {
//$('#map_canvas').gmap('openInfoWindow', {'content': 'Hello World!'}, this);
});
