Search code examples
javascriptxmlgoogle-mapsgeolocation

How to search a specific attribute in XML to retrieve another attribute?


Actually, I'm trying to work with the Google Maps Javascript API in order to generate specific markers from my database to use it in an autocomplete form. I can't save my markers in Google Places because there would have too many and they won't really be relevant for everyone! But, Google doesn't know all my places, so can't geocode it. I've decided to generate an XML file with my markers; here is a sample :

<?xml version="1.0"?>
<markers>
  <marker name="Pan Africa Market" address="1521 1st Ave, Seattle, WA" lat="47.608940" lng="-122.340141" type="restaurant"/>
  <marker name="Buddha Thai &amp; Bar" address="2222 2nd Ave, Seattle, WA" lat="47.613590" lng="-122.344391" type="bar"/>
  <marker name="The Melting Pot" address="14 Mercer St, Seattle, WA" lat="47.624561" lng="-122.356445" type="restaurant"/>
  <marker name="Ipanema Grill" address="1225 1st Ave, Seattle, WA" lat="47.606365" lng="-122.337654" type="restaurant"/>
  <marker name="Sake House" address="2230 1st Ave, Seattle, WA" lat="47.612823" lng="-122.345673" type="bar"/>
  <marker name="Crab Pot" address="1301 Alaskan Way, Seattle, WA" lat="47.605961" lng="-122.340363" type="restaurant"/>
  <marker name="Mama's Mexican Kitchen" address="2234 2nd Ave, Seattle, WA" lat="47.613976" lng="-122.345467" type="bar"/>
  <marker name="Wingdome" address="1416 E Olive Way, Seattle, WA" lat="47.617214" lng="-122.326584" type="bar"/>
  <marker name="Piroshky Piroshky" address="1908 Pike pl, Seattle, WA" lat="47.610126" lng="-122.342834" type="restaurant"/>
</markers>

How can I use JavaScript in order to retrieve the lat and lng attributes for a specific name attribute ?


Solution

  • You can use the following XPath expressions:

    • /markers/marker[@name='Crab Pot']/@lng

    • /markers/marker[@name='Crab Pot']/@lat

    from the Chrome Developers Tools:

    $x("/markers/marker[@name='Crab Pot']/@lat")
    

    or programmatically using Document.evaluate() in JavaScript:

    console.log( document.evaluate("/markers/marker[@name='Crab Pot']/@lat", 
                 document, null, XPathResult.FIRST_ORDERED_NODE_TYPE,
                 null).singleNodeValue );