Google Maps Custom Control positioning -

-

i trying figure out how position control center of page. when use "bottom_center" centers left end of div center of map. i'd offset center of div in bottom center of map. i've search hours , haven't found info on doing this..

does have idea how or can point me @ resource explain little better?

thanks!

the below modified version of converting latlng/pixel coordinate control

<!doctype html> <html>   <head>     <meta http-equiv="content-type" content="text/html; charset=utf-8" />     <title>latlng coordinates control</title>      <style type="text/css">       #map {         width: 800px;         height: 600px;       }        #latlng-control {         background: #ffc;         border: 1px solid #676767;         font-family: arial, helvetica, sans-serif;         font-size: 0.7em;         padding: 2px 4px;         position: absolute;       }     </style>      <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>      <script type="text/javascript">  function degtodms(dec) {      var deg = math.floor(math.abs(dec));     var min = math.floor((math.abs(dec)-deg)*60);     var sec = (math.round((((math.abs(dec) - deg) - (min/60)) * 60 * 60) * 100) / 100 ) ;      var len = string(deg).length     deg = array(3 + 1 - len).join('0') + deg;     var len = string(min).length     min = array(2 + 1 - len).join('0') + min;     var len = string(sec).length     sec = array(5 + 1 - len).join('0') + sec;      deg = dec < 0 ? '-' + deg : deg;          var dec_min = (min*1.0 + (sec/60.0));      var dms  = deg + '&deg ' + dec_min.tofixed(3) + '\'';     return dms; }         function latlngcontrol(map) {          this.node_ = this.createhtmlnode_();         map.controls[google.maps.controlposition.bottom_center].push(this.node_);         this.setmap(map);         this.set('visible', false);       }        latlngcontrol.prototype = new google.maps.overlayview();       latlngcontrol.prototype.draw = function() {};        latlngcontrol.prototype.createhtmlnode_ = function() {         var divnode = document.createelement('div');         divnode.id = 'latlng-control';         divnode.index = 100;         return divnode;       };        latlngcontrol.prototype.visible_changed = function() {         this.node_.style.display = this.get('visible') ? '' : 'none';         //this.node_.style.floatright  = '100px';         };        latlngcontrol.prototype.updateposition = function(latlng) {         var dmslat = degtodms(latlng.lat().tofixed(4));         var dmslon = degtodms(latlng.lng().tofixed(4));         this.node_.innerhtml = 'mouse position: ' +  dmslat + ', ' + dmslon;           };        function init() {         var centerlatlng = new google.maps.latlng(37.748582,-122.418411);         var map = new google.maps.map(document.getelementbyid('map'), {           'zoom': 10,           'center': centerlatlng,           'maptypeid': google.maps.maptypeid.roadmap         });          var latlngcontrol = new latlngcontrol(map);          google.maps.event.addlistener(map, 'mouseover', function(mevent) {           latlngcontrol.set('visible', true);         });         google.maps.event.addlistener(map, 'mouseout', function(mevent) {           latlngcontrol.set('visible', false);         });         google.maps.event.addlistener(map, 'mousemove', function(mevent) {           latlngcontrol.updateposition(mevent.latlng);         });       }        google.maps.event.adddomlistener(window, 'load', init);     </script>   </head>   <body>     <h2>latlng coordinate control</h2>     <div id="map"></div>   </body> </html>

for little while there thought might have uncovered bug in google api!... no, alas have been easy ;-)

your basic problem here when sticking div latlngcontrol onto map its' width 0. goes meant , when put text div expands out point. if grab map , pan mouse, you'll notice latlngcontrol reposition way intended. quick fix, make modification:

  function latlngcontrol(map) {       this.node_ = this.createhtmlnode_();      var dmslat = degtodms(map.getcenter().lat().tofixed(4));      var dmslon = degtodms(map.getcenter().lng().tofixed(4));      this.node_.innerhtml = 'mouse position: ' +  dmslat + ', ' + dmslon;      map.controls[google.maps.controlposition.bottom_center].push(this.node_);      this.setmap(map);   // this.set('visible', false);  <---keep simple   }

if really want page load latlng div invisible you'll need futz around little more - hack i'm thinking of programmatically pan map & forth when first move mouse on map - when shake tv remote make work properly... that's icky.

also this

position: absolute;

in css redundant. , this

divnode.index = 100;

...i know you're possibly trying position latlng div above google legal blurb it's not obscured. , can done, have attach div page directly , not via map.


Comments

Post a Comment

Popular posts from this blog

java - SNMP4J General Variable Binding Error -

-
i trying use snmp4j snmp bulkget. when ever use snmp4j make call returned responseevent error says "general variable binding error" , data returned equal null. to debug: print out, console, exact oid , version number using in snmp4j. use printed out data snmpwalk on command line. valid results. know sending snmp4j correct pdu correct oid, version number, max repititions, etc. i have used snmp4j , code wrote succesffuly monitor other devices years. don't know different time. leaving me stumped. why "general variable binding error?" causes error? ideas debug? can reproduced? if so, first action should using wireshark or microsoft network monitor capture network packets. my guess agent gives generr response, not surprising, http://www.ietf.org/rfc/rfc1157.txt
Read more

windows - Python Service Installation - "Could not find PythonClass entry" -

-
i working on building python service. inducing error, not sure inducing it. ps c:\...> python .\file.py debug debugging service myservice - press ctrl+c stop. error 0xc00000f4 - not find service's pythonclass entry in registry error 1814 - specified resource name cannot found in image file. error 0xc0000080 - not locate module name in python class string (ie, no '.') this error coming pythonservicemessages.mc in pythonwin32. it turns out error result caused exception being thrown , python script dying off.
Read more

Determine if a XmlNode is empty or null in C#? -

-
the following code takes xmlnode data type , populates dataset object xmlnode content. write dataset's content file. public void populatedataset(xmlnode node) { xmlnodereader reader = new xmlnodereader(node); dataset ds = new dataset(); ds.readxml(reader); system.guid guid = system.guid.newguid(); string name = string.format("{0}{1}_{2}.xml", utility.xmloutputpath, utility.xmloutputfilename, guid.tostring()); //need write "node empty" file if xmlnode object empty of null ds.writexml(name, xmlwritemode.ignoreschema); } the problem encountered 1 scenario not write content file. how determine if xmlnode object null or empty? you can check if node parameter null or has innertext or innerxml properties null or empty, when enter method before creating xmlnodereader .
Read more