Jump to:

23453 Posts in 18904 Topics by 2877 members

General Questions

SilverStripe Forums » General Questions » Google Map To And From Maps

General questions about getting started with SilverStripe that don't fit in any of the categories above.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Page: 1
Go to End
Author Topic: 1646 Views
  • GustyPolo
    Avatar
    Community Member
    9 Posts

    Google Map To And From Maps Link to this post

    Hey, I was wondering if I could get some help. I'm trying to create a to and from map form google. I've made one before not suing silverstripe and it works perfectly. Here's the example http://iglesiacristoviene.ca/direcciones.php it's for a spanish church. So what the user does is they put their address in from (desde) field and since the to (hasta) field is preset to the locaiton they just submit and the map updates with the directions shown on the bottom. I'm trying to get the same thing done for another website elremanentefiel.com/direcciones , but tis time using silverstripe. What I thought was going to be straight forward isn't exactly. I figured that since this part wasn't going to be updated I could create a new page, Direcciones.ss and Direcciones.php and just put in everything there. At first glass, it all works perfect, but the problem comes when I want to put in a new address. Once I submit it takes me to my home page. Any ideas? Here are the main parts of code;

    Direcciones.ss
    _______________________________

    <div>
    <div id="map_canvas"></div>

    <div id="addressform">
       
    <p>Para conseguir direcciónes hacia el templo escriba su direcci&oacute;n en la casilla &quot; <strong>Desde&quot;</strong> y presione el bot&oacute;n <strong>&quot;Obtener</strong>.&quot;</p>
       
    <form action="#" onsubmit="setDirections(this.from.value, this.to.value, this.locale.value); return false">

    <p><strong>Desde:</strong></p>

    <input type="text" class="adresses" id="fromAddress" name="from" value="Lester B Pearson Int'l Airport"/>

    <p><strong>Hasta:</strong></p>

    <input type="text" class="adresses" id="toAddress" name="to" value="80 Royalcrest Road, Toronto, Ontario. M9V 4C1" />
       
    <!--Idioma:
    <select id="locale" name="locale">
    <option value="es"selected>Spanish</option>
    <option value="en">English</option>
    <option value="fr">French</option>
    </select>-->

    <input name="submit" type="submit" value="Obtener" />

    </form>
          
    </div>
    ______________________________

    Here's the Js file which i linked on my main Page.ss like so along with my API key

    <script src=" http://maps.google.com/?file=api&amp;v=2.x&amp;key=ABQIAAAA4_CEaXFTVzb07PAu2uL-rhR7k_ABripYysp6FSAv_6idJ73P1xTjp7fy5W-BiORC9YjJJ2splqKICw" type="text/javascript"></script>

    <script src="mysite/javascript/google.js" type="text/javascript"></script>

    google.js
    _______________________

       var map;
    var gdir;
    var geocoder = null;
    var addressMarker;

    function initialize() {
    if (GBrowserIsCompatible()) {
    map = new GMap2(document.getElementById("map_canvas"));
    gdir = new GDirections(map, document.getElementById("directions"));
    GEvent.addListener(gdir, "load", onGDirectionsLoad);
    GEvent.addListener(gdir, "error", handleErrors);
          map.addControl(new GSmallMapControl());
    map.addControl(new GMapTypeControl());

    setDirections("970 Dixon Road, Toronto, ON M9W 1J9, Canada (Lester B Pearson Int'l Airport)", "80 Royalcrest Road, Toronto, Ontario. M9V 4C1", "es");
    }
    }

    function setDirections(fromAddress, toAddress, locale) {
    gdir.load("from: " + fromAddress + " to: " + toAddress,
    { "locale": locale });
    }

    function handleErrors(){
        if (gdir.getStatus().code == G_GEO_UNKNOWN_ADDRESS)
        alert("No corresponding geographic location could be found for one of the specified addresses. This may be due to the fact that the address is relatively new, or it may be incorrect.\nError code: " + gdir.getStatus().code);
        else if (gdir.getStatus().code == G_GEO_SERVER_ERROR)
        alert("A geocoding or directions request could not be successfully processed, yet the exact reason for the failure is not known.\n Error code: " + gdir.getStatus().code);
       
        else if (gdir.getStatus().code == G_GEO_MISSING_QUERY)
        alert("The HTTP q parameter was either missing or had no value. For geocoder requests, this means that an empty address was specified as input. For directions requests, this means that no query was specified in the input.\n Error code: " + gdir.getStatus().code);

       // else if (gdir.getStatus().code == G_UNAVAILABLE_ADDRESS) <--- Doc bug... this is either not defined, or Doc is wrong
       // alert("The geocode for the given address or the route for the given directions query cannot be returned due to legal or contractual reasons.\n Error code: " + gdir.getStatus().code);
       
        else if (gdir.getStatus().code == G_GEO_BAD_KEY)
        alert("The given key is either invalid or does not match the domain for which it was given. \n Error code: " + gdir.getStatus().code);

        else if (gdir.getStatus().code == G_GEO_BAD_REQUEST)
        alert("A directions request could not be successfully parsed.\n Error code: " + gdir.getStatus().code);
       
        else alert("An unknown error occurred.");
       
       }

       function onGDirectionsLoad(){
    // Use this function to access information about the latest load()
    // results.

    // e.g.
    // document.getElementById("getStatus").innerHTML = gdir.getStatus().code;
        // and yada yada yada...
       }

    _______________________________________

    Also to get the map to load I had to play this on the <body> tag in the main Page.ss

    <body onload="initialize()" onunload="GUnload()">

    Like I said the script and everything works since it loads the map along with the directions, but it goes wonky once I submit a new address.

    Any help would be awesome.

    Thanks

    Gusty

    1646 Views
Page: 1
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.