javascript - Google maps bounds not working -

-

i trying set bounds of custom google map user cannot zoom out far (to point world map starts tile horizontally), , cannot drag far vertically avoid this issue.

i've added code set bounds, no longer seem able drag @ (uncomment bounds code recreate). want bounds world map avoid issue in screenshot above. obvious i've missed?

<!doctype html>  <html lang="en">  <head>  <meta charset="utf-8">  <title>document</title>    <style>  	#map_canvas {  		width: 100%;  		height: 650px;  	} // #map  </style>  </head>  <body>  <div id="map_canvas"></div>    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>  <script type="text/javascript">  function coordmaptype(tilesize) {  	this.tilesize = tilesize;  }    coordmaptype.prototype.gettile = function(coord, zoom, ownerdocument) {  		var div = ownerdocument.createelement('div');  		  	div.style.width = this.tilesize.width + 'px';  	div.style.height = this.tilesize.height + 'px';  	div.style.backgroundimage = 'url(http://www.transparenttextures.com/patterns/dark-denim-3.png)';  		  	return div;  };    var map;  var mullem = new google.maps.latlng(50.3873733,7.4952241);    function initialize() {  	var latlng = new google.maps.latlng(50.3873733,7.4952241);  	var myoptions = {  			disabledefaultui: true,  						zoom: 2  	};    	var map = new google.maps.map(document.getelementbyid("map_canvas"),  			myoptions);  	var mylatlng = new google.maps.latlng(50.3869012,  7.4950149);  	var marker = new google.maps.marker({  		position: new google.maps.latlng(40.6700, -73.9400),  							map: map,  							icon: 'images/map-marker.png',  							zindex: 999999  					});    	map.setcenter(new google.maps.latlng(51.508742,-0.120850));    	// map bounds  	/*var allowedbounds = new google.maps.latlngbounds(  			 new google.maps.latlng(83.829945, 160.839844),   			 new google.maps.latlng(-72.711903, -165.058594)  	);  	var lastvalidcenter = map.getcenter();    		google.maps.event.addlistener(map, 'center_changed', function() {  			if (allowedbounds.contains(map.getcenter())) {  					// still within valid bounds, save last valid position  					lastvalidcenter = map.getcenter();  					return;   			}    			// not valid anymore => return last valid position  			map.panto(lastvalidcenter);  	});*/  	// map bounds - end  	    		map.overlaymaptypes.insertat(0, new coordmaptype(new google.maps.size(256, 256)));  	}    	google.maps.event.adddomlistener(window, 'load', initialize);    </script>  </body>  </html>

from the documentation:

latlngbounds(sw?:latlng|latlngliteral, ne?:latlng|latlngliteral) constructs rectangle points @ south-west , north-east corners.

your bounds backwards:

var allowedbounds = new google.maps.latlngbounds(          new google.maps.latlng(83.829945, 160.839844),  // ne          new google.maps.latlng(-72.711903, -165.058594) // sw );

should be: 

var allowedbounds = new google.maps.latlngbounds(          new google.maps.latlng(-72.711903, -165.058594), // sw          new google.maps.latlng(83.829945, 160.839844)    // ne );

proof of concept fiddle

code snippet:

function coordmaptype(tilesize) {    this.tilesize = tilesize;  }    coordmaptype.prototype.gettile = function(coord, zoom, ownerdocument) {    var div = ownerdocument.createelement('div');      div.style.width = this.tilesize.width + 'px';    div.style.height = this.tilesize.height + 'px';    div.style.backgroundimage = 'url(http://www.transparenttextures.com/patterns/dark-denim-3.png)';      return div;  };    var map;  var mullem = new google.maps.latlng(50.3873733, 7.4952241);    function initialize() {    var latlng = new google.maps.latlng(50.3873733, 7.4952241);    var myoptions = {      disabledefaultui: true,      zoom: 2    };      var map = new google.maps.map(document.getelementbyid("map_canvas"),      myoptions);    var mylatlng = new google.maps.latlng(50.3869012, 7.4950149);    var marker = new google.maps.marker({      position: new google.maps.latlng(40.6700, -73.9400),      map: map,      icon: 'http://maps.google.com/mapfiles/ms/micons/blue.png',      zindex: 999999    });      map.setcenter(new google.maps.latlng(51.508742, -0.120850));      // map bounds    //   latlngbounds(sw?:latlng|latlngliteral, ne?:latlng|latlngliteral)	constructs rectangle points @ south-west , north-east corners.    var allowedbounds = new google.maps.latlngbounds(      new google.maps.latlng(-72.711903, -165.058594), // sw      new google.maps.latlng(73.829945, 160.839844) // ne    );    var lastvalidcenter = map.getcenter();      google.maps.event.addlistener(map, 'center_changed', function() {      if (allowedbounds.contains(map.getcenter())) {        // still within valid bounds, save last valid position        lastvalidcenter = map.getcenter();        return;      }        // not valid anymore => return last valid position      map.panto(lastvalidcenter);    });    // map bounds - end        map.overlaymaptypes.insertat(0, new coordmaptype(new google.maps.size(256, 256)));  }    google.maps.event.adddomlistener(window, 'load', initialize);
html,  body,  #map_canvas {    width: 100%;    height: 100%;  }  // #map
<script src="https://maps.googleapis.com/maps/api/js"></script>  <div id="map_canvas"></div>


Comments

Post a Comment

Popular posts from this blog

java - Run spring boot application error: Cannot instantiate interface org.springframework.context.ApplicationListener -

-
i have spring project , try make use spring boot , run @ embadded tomcat following : https://spring.io/guides/gs/rest-service/ this application //@configuration //@enableaspectjautoproxy @springbootapplication @componentscan(basepackages = "gux.prome") public class application { public static void main(string[] args) { springapplication.run(application.class, args); } } if use maven command: mvn spring-boot:run , project starts fine, need debug , run main method @ intelij, exception occurs: exception in thread "main" java.lang.illegalargumentexception: cannot instantiate interface org.springframework.context.applicationlistener : org.springframework.boot.logging.classpathloggingapplicationlistener @ org.springframework.boot.springapplication.createspringfactoriesinstances(springapplication.java:414) @ org.springframework.boot.springapplication.getspringfactoriesinstances(springapplication.java:394) @ org.springframework.bo...
Read more

reactjs - React router and this.props.children - how to pass state to this.props.children -

-
i'm using react-router first time , don't know how think in yet. here's how i'm loading components in nested routes. entry point .js reactdom.render( <router history={hashhistory} > <route path="/" component={app}> <route path="models" component={content}> </route> </router>, document.getelementbyid('app') ); app.js render: function() { return ( <div> <header /> {this.props.children} </div> ); } so child of app content component sent in. i'm using flux , app.js has state , listens changes, don't know how pass state down this.props.children. before using react-router app.js defines children explicitly, passing state natural don't see how now. using couple of react helper methods can add state, props , whatever else this.props.children render: function() { var children = react.ch...
Read more

Excel VBA "Microsoft Windows Common Controls 6.0 (SP6)" Location Changes -

-
i have excel workbook used generate quotations customers. there main page user inputs data, , there buttons generate various pdfs , send them customer. however, 1 user consistently getting error preventing generating , sending pdfs. i beleive "microsoft windows common controls 6.0 (sp6)". it's installed on users' computers. on mine, location "c:\windows\syswow64\mscomctl.ocx" on others "c:\windows\system32\mscomctl.ocx" the user experiencing issues on 32-bit machine, "mscomctl.ocx" file should in system32. have manually put in there, , pointed common controls reference in vba it. issue seems keep reverting looking in syswow64. since folder doesn't exist, can't find it, , can't produce pdfs. i thought perhaps issue user running older version of office (2007) there users on 2013 , 2016. thought perhaps mixture of 64-bit , 32-bit users. user gets sent workbook other users (as quotation process goes further, gets passed ...
Read more