none
Newbie Question: How can I pass a Geolocation API result value to an element through JavaScript

    Question

  • I am trying to get the alt/long for when I do a query with a city and state.

    I managed to get an alert with the coordinates, but I just cant seem to figuere out how to have it show up on the page when the button is clicked and the "ClickGeocode" is called

    I created a div with id "coords" 

    After MUCH trial and error, I'm all out of ideas and would GREATLY appreciate any help

    Here is what Ive got so far:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
       <head>
          <title></title>
          <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    
          <script type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0"></script>
    
          <script type="text/javascript">
             
             var map = null;
     
             function GetMap()
             {
                // Initialize the map
                map = new Microsoft.Maps.Map(document.getElementById("mapDiv"),{credentials:"API Key", mapTypeId:Microsoft.Maps.MapTypeId.road}); 
    
             }
    
             function ClickGeocode(credentials)
             {
                map.getCredentials(MakeGeocodeRequest);
             }
    
             function MakeGeocodeRequest(credentials)
             {
    
                var geocodeRequest = "http://dev.virtualearth.net/REST/v1/Locations?query=" + encodeURI(document.getElementById('txtQuery').value) + "&output=json&jsonp=GeocodeCallback&key=" + credentials;
    
                CallRestService(geocodeRequest);
             }
    
             function GeocodeCallback(result) 
             {
                alert("Found location: " + result.resourceSets[0].resources[0].point.coordinates);
                
        
    
    
    
    
    
                if (result &&
                       result.resourceSets &&
                       result.resourceSets.length > 0 &&
                       result.resourceSets[0].resources &&
                       result.resourceSets[0].resources.length > 0) 
                {
                   
    
                 
                  
    
    			
    			
    		
    		
    		
    	
              }  
           }  
    
             function CallRestService(request) 
             {
                var script = document.createElement("script");
                script.setAttribute("type", "text/javascript");
                script.setAttribute("src", request);
                document.body.appendChild(script);
             }
    
    
    
    
          </script>
       </head>
       <body onload="GetMap();">
          <div id='mapDiv' style="; width:400px; height:400px;"></div>
          <input id="txtQuery" type="text" value="Portland"/>
          <input type="button" value="Geocode" onclick="ClickGeocode()"/>    
          <div id="coords"></div> 
    
    
       </body>
    </html>


    • Edited by David Coner Tuesday, September 03, 2013 9:14 AM wanted to take out API key
    Tuesday, September 03, 2013 9:08 AM

Answers