Google Maps v3 - 设置缩放级别并固定到世界地图的边界

Question

我一直在网上寻找地图问题的解决方案，但并没有真正解决问题。我是JS的新手。

请参阅下面的示例，它有标记，但最理想的是您只看到标记和世界地图一次：如果您单击并向左拖动，例如它只是不断重复世界地图和标记再一次。

我希望当你到达地图的尽头并且只显示标记一次时，我可能会停下来。这可能与我的代码有关吗？

＆＃13;

＆＃13;

$(document).ready(function() {
	var styles = {
        'AmbientLounge': [{
		    featureType: "water",
		    elementType: "geometry",
		    stylers: [
		    	{ weight: 4 },
		    	{ visibility: "on" },
		    	{ invert_lightness: true },
		    	{ color: "#333333" }
		    ]
		},
		{
		    featureType: "landscape",
		    stylers: [
		    	{ color: "#2996b3" }
		    ]
		},
		{
		    elementType: "labels.text",
		    stylers: [
		    	{ visibility: "off" }
		    ]
		},
		{
		    featureType: "administrative.country",
		    elementType: "geometry.stroke",
		    stylers: [
		    	{ color: "#333333" }
		    ]
		}]
    }

	new Maplace({
	    map_div: '#gmap',
	    controls_type: 'list',
	    locations: Locs,
	    start: 0,
	    styles: styles,
	    map_options: {
	        zoom: 2,
	        set_center: [0,0],
	        panControl: false,
		    zoomControl: true,
		    scaleControl: false,
		    disableDoubleClickZoom: true,
		    draggable: true
	    }
	}).Load(); 
});

＆＃13;

/* -----------------------------------------
   General
----------------------------------------- */

ul, ol, dl {
    margin-bottom: 20px
}
html, body {
    height: 100%;
}
.gmap {
    height: 100%;
    width: 100%;
    font-size: 90%;
}

.gmap + .gmap {
    margin: 5px 0;
}

.canvas_map {
    width: 100% !important;
}

.gmap img, .gmap object, .gmap embed { max-width: none; height: auto }

.gmap *,.gmap *:before,.gmap *:after{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;}

.gmnoprint {
    display: none;
}

.gm-style-mtc div {
    font-size: 15px !important;
    padding: 5px 15px !important;
}

#controls .ullist {
    margin: 0px; 
    padding: 0px; 
    list-style-type: none;
}

.on_gmap.list.gmap_controls {
    left: 0 !important;
    top: 3px !important;
}

.on_gmap.list.gmap_controls .wrap_controls {
    border: 0 !important;
    box-shadow: none !important;
    background: none !important;
}

.ullist li {
    float: left;
    background: rgba(0, 0, 0, .6);
    color: #ffffff;
    padding: 0 10px;
    margin-right: 10px;
}

.ullist li a {
    color: #ffffff !important;
}

.ullist li.active {
    background: #ED2088;
}
.gmap * {
    font-size: 100%;
}

.ullist {
    width: 100%;
}

.ullist li a:hover,
.ullist li:hover {
    background: #eee !important;
    color: #2a2a2a !important;
}

.ullist li.active a,
.ullist li.active:hover {
    color: #ffffff !important;
    background-color: #ED2088 !important;
    font-size: 12px !important;
}

.gm-style-iw p {
    margin:3px 0;
}

.gm-style-iw h3 {
    font-size: 20px !important;
    margin: 5px 0 10px 0;
    border-bottom: 1px solid lightgrey;
}

@media only screen and (max-width: 767px) {

    h2 { 
        font-size: 24px;
    }

    h3 {
        font-size: 20px;
    }
}

＆＃13;

<div id="gmap" class="gmap"></div>

<script src="http://maps.google.com/maps/api/js?sensor=false&libraries=geometry&v=3.7"></script>
<script src="http://code.jquery.com/jquery-1.9.0.min.js"></script>
<script src="http://www.ambientlounge.com/external/map-v2/maplace.min.js"></script>
<script src="http://www.ambientlounge.com/external/map-v2/locations.js"></script>

＆＃13;

＆＃13;

＆＃13;