#1
  1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    May 2000
    Location
    Baltimore
    Posts
    184
    Rep Power
    14

    Formattig Google Directions


    I am using google directions with waypoints. Not sure how to exaplin this but here we go...

    In the google directions when using waypoints each of the directions start and end destination is wrapped in

    <leg><html_instructions></html_instructions>
    <html_instructions></html_instructions>
    <html_instructions></html_instructions>
    <html_instructions></html_instructions>
    <html_instructions></html_instructions>
    <start_address></start_address>
    <end_address></end_address>
    </leg>

    <leg><html_instructions></html_instructions>
    <html_instructions></html_instructions>
    <html_instructions></html_instructions>
    <start_address></start_address>
    <end_address></end_address>
    </leg>

    I am trying to loop through and echo out the start addre address, then the directions, then the end address, each to have a section or block of its own, but what I am getting instead is the start address, then the directions for both of the waypoint and then the end address.

    It looks like this:

    from address 1
    directiona 1
    directiona 2
    directiona 3
    directiona 4
    directionb 1
    directionb 2
    directionb 3
    destination 1

    from address 2
    directiona 1
    directiona 2
    directiona 3
    directiona 4
    directionb 1
    directionb 2
    directionb 3
    destination 2

    It should look like this:

    from address 1
    directiona 1
    directiona 2
    directiona 3
    directiona 4
    destination 1

    from address 2
    directionb 1
    directionb 2
    directionb 3
    destination 2

    Here is the code I am using:

    xmlDoc=xmlhttp.responseXML;

    aaa=xmlDoc.getElementsByTagName(\"leg\");
    ccc=xmlDoc.getElementsByTagName(\"end_address\");
    for (i=0;i<aaa.length;i++)
    {
    bbb=xmlDoc.getElementsByTagName(\"html_instructions\");
    for (i2=0;i2<bbb.length;i2++)
    {
    document.write(bbb[i2].childNodes[0].nodeValue);
    document.write(\"<br>\");
    }
    document.write(ccc[i].childNodes[0].nodeValue);
    document.write(\"<br>\");
    }

    Thanks in advance.

    P.S. The \'s are there because I am using PHP to echo.
  2. #2
  3. Come play with me!
    Devshed Supreme Being (6500+ posts)

    Join Date
    Mar 2007
    Location
    Washington, USA
    Posts
    13,749
    Rep Power
    9397
    Code:
    xmlDoc.getElementsByTagName(\"html_instructions\");
    That will get all the <html_instruction> nodes in the entire HTML. You only want to get them according to the current leg.
    PHP Code:
    echo "

    var xmlDoc = xmlhttp.responseXML;

    var legs = xmlDoc.getElementsByTagName(\"leg\");
    for (var l = 0; l < legs.length; l++) {
        var instructions = legs[l].getElementsByTagName(\"html_instructions\");
        for (var i = 0; i < instructions.length; i++) {
            document.write(instructions[i].innerHTML);
            document.write(\"<br/>\");
        }
        document.write(legs[l].getElementsByTagName(\"end_address\")[0].innerHTML;
        document.write(\"<br/>\");
    }

    "

    Please avoid document.write() though - create <p>s or <li>s or whatever and append them to a specific element on the page.
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    May 2000
    Location
    Baltimore
    Posts
    184
    Rep Power
    14
    Thanks for the fast reply, but when ever I replace my code with your code, nothing on the page shows up but I not getting any errors. Any ideas?
  6. #4
  7. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    May 2000
    Location
    Baltimore
    Posts
    184
    Rep Power
    14
    I was able to solve my problem with the help of your example. My final code ended up looking like this:


    xmlDoc=xmlhttp.responseXML;

    aaa=xmlDoc.getElementsByTagName(\"leg\");
    ccc=xmlDoc.getElementsByTagName(\"end_address\");
    for (i=0;i<aaa.length;i++) {
    bbb=aaa[i].getElementsByTagName(\"html_instructions\");
    for (i2=0;i2<bbb.length;i2++)
    {
    document.write(bbb[i2].childNodes[0].nodeValue);
    document.write(\"<br>\");
    }
    document.write(ccc[i].childNodes[0].nodeValue);
    document.write(\"<br>\");
    document.write(\"<br>\");
    }

    I am going to style it, of course but this is how I wanted it to work.

    Thanks again.

IMN logo majestic logo threadwatch logo seochat tools logo