1. Computer problem? Tech Support Guy is completely free -- paid for by advertisers and donations. Click here to join today! If you're new to Tech Support Guy, we highly recommend that you visit our Guide for New Members.

Display map onload and onclick render differently?

Discussion in 'Web Design & Development' started by JiminSA, Dec 20, 2012.

Thread Status:
Not open for further replies.
Advertisement
  1. JiminSA

    JiminSA Thread Starter

    Joined:
    Dec 15, 2011
    Messages:
    3,393
    First Name:
    Jim
    I am displaying a map when the address is present in the db.
    If I get the map using onclick (I would prefer an automatic render) it displays just fine.
    If I get it using body onload, it displays the bottom-right-hand-corner in the top-left-hand-corner of the container:confused:
    The js functions called to perform the displays are here...
    HTML:
    <script type="text/javascript">
           var geocoder;
           var map;      
           function initialize() {
                  
             geocoder = new google.maps.Geocoder();     
             var latlng = new google.maps.LatLng(-26.204102800000000000, 28.047305100000017000);     
             var myOptions = {       
               zoom: 12,       
               center: latlng,       
               mapTypeId: google.maps.MapTypeId.ROADMAP
             }
             map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
         }
       
           function codeAddress() {
             var address = document.getElementById("address").value;
             geocoder.geocode({'address': address},function(results, status) {
               if (status == google.maps.GeocoderStatus.OK) {
                 map.setCenter(results[0].geometry.location);
                 var marker = new google.maps.Marker({
                     map: map,
                     position: results[0].geometry.location
           });
             } else {
               alert("Geocode was not successful for the following reason: " + status);
             }
           });   
         }   
    </script>
    
    here's the body onload...
    HTML:
    <body onLoad="javascript:preloader();initialize();codeAddress();">
    and here's the onclick...
    HTML:
    <input type=\"button\" value=\"Generate Map\" onclick=\"initialize();codeAddress();\">
    which is echo'd out - hence the escaping chars.

    Any insights would be appreciated...:)
     
  2. JiminSA

    JiminSA Thread Starter

    Joined:
    Dec 15, 2011
    Messages:
    3,393
    First Name:
    Jim
    It's OK - after a little research I discovered that google maps doesn't like being in a hidden div (which is where it was). So as a shortcut solution (lazyman's) I took it out and made it a popup...
    I'd still love to know how to talk google maps into handling hidden maps, though:( (and maybe some hidden treasure:)) So I'll leave it unsolved for now...
     
  3. ckphilli

    ckphilli

    Joined:
    Apr 29, 2006
    Messages:
    4,393
    Jim, I am really not a fan of inline calls,l they have caused issues for me in the past...maybe try below and see how it reacts with the hidden stuff...

    Code:
    $(document).ready(function() {
      //put your entire script here
    });
    OR
    Code:
    //your script
    window.onload = //your functions
    OR

    Code:
    //your script
    $(document).ready(function() {
      //function();
      //function2();
    });
    Here's a little more speak on it: http://stackoverflow.com/questions/3698200/window-onload-vs-document-ready

    Also...not seeing preloader() in your script.

    EDIT: obviously...
    Code:
    <body onLoad="javascript:preloader();initialize();codeAddress();"> 
    becomes
    Code:
    <body> 
     
  4. JiminSA

    JiminSA Thread Starter

    Joined:
    Dec 15, 2011
    Messages:
    3,393
    First Name:
    Jim
    Thanks for the tip Chris, I'll see what the effect of running the functions prior to body onload has on the google map render and let you know:)
     
As Seen On
As Seen On...

Welcome to Tech Support Guy!

Are you looking for the solution to your computer problem? Join our site today to ask your question. This site is completely free -- paid for by advertisers and donations.

If you're not already familiar with forums, watch our Welcome Guide to get started.

Join over 733,556 other people just like you!

Thread Status:
Not open for further replies.

Short URL to this thread: https://techguy.org/1081673

  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Dismiss Notice