troubleshooting Question

Insert Coordinates from External File into Google Maps.

Avatar of Mario Zio
Mario ZioFlag for Italy asked on
JavaScriptWeb DevelopmentHTML
8 Comments1 Solution948 ViewsLast Modified:
Hi everyone!

I seem to have a Javascript problem, probably due to sheer inexperience. I'm trying to feed specific coordinates into Google Maps javascript. The coordinates come from a specific file on my web server (coords.txt). The Javascript I have set up so far will read the coordinates file (coords.txt) and display it in text form within the HTML page. That's great (at least I know I don't have a file reading issue). I guess my question is: How do I define a javascript variable THAT Google Maps CAN USE from the contents of my coords.txt text file ? The vision is to dynamically save and load the map coordinates on the coords.txt file everytime that someone clicks on the map, and draws a line from a point to the next one,thus updating the map for web page visitors as soon as location updates become available. I attached the code to fix :


<script type="text/javascript">
 
function ajaxFunction()
{
var xmlhttp;
    if (window.XMLHttpRequest)
    {
    // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
    }
    
    else if (window.ActiveXObject)
    {
    // code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    }
    
    else
    {
    alert("Problem! Your browser does not support XMLHTTP or AJAX!");
    }
xmlhttp.onreadystatechange=function()
    { 
        if(xmlhttp.readyState==4)
        { 
        document.getElementById('coords').innerHTML=xmlhttp.responseText;
        } 
    }

xmlhttp.open("GET","coords.txt",true);
xmlhttp.send(null);
} 
//<![CDATA[
 
    var map;

    var polyShape;
  
    var polygonMode;
 
    var polygonDepth = "20";
  
    var polyPoints = [];

    var marker;

    var geocoder = null;

    var fillColor = "#0000FF"; // blue fill
 
    var lineColor = "#000000"; // black line

    var opacity = .5;

    var lineWeight = 4;

    var kmlFillColor = "7dff0000"; // half-opaque blue fill
  
    function load() {

  
      if (GBrowserIsCompatible()) {
  
        map = new GMap2(document.getElementById("map"));

        map.setCenter(new GLatLng(43.23920036180898, 43.75213623046875), 9);

        map.addControl(new GSmallMapControl());

        map.addControl(new GMapTypeControl());

        map.addMapType(G_PHYSICAL_MAP);

        GEvent.addListener(map, 'click', mapClick);
 
        geocoder = new GClientGeocoder();
  
      }
 
    }

    // mapClick - Handles the event of a user clicking anywhere on the map
  
    // Adds a new point to the map and draws either a new line from the last point

    // or a new polygon section depending on the drawing mode.
 
    function mapClick(marker, clickedPoint) {

    // Push onto polypoints of existing polygon
 
      polyPoints.push(clickedPoint);
  
      drawCoordinates();
  
    }
  
    // Clear current Map
  
      function clearMap(){

      map.clearOverlays();

      polyPoints = [];

      document.getElementById("coords").value =  "Click on the map to start drawing a line";


    }

   

    // Delete last Point

    // This function removes the last point from the Polygon and redraws

    // map.

    function deleteLastPoint(){

    map.removeOverlay(polyShape);
 
      // pop last element of polypoint array
  
      polyPoints.pop();
  
      drawCoordinates();
  
    }
  
    // drawCoordinates
  
    function drawCoordinates(){

      //Re-create Polygon
  
      
      polyShape = new GPolyline(polyPoints,lineColor,lineWeight,opacity);

      map.clearOverlays();

       // Grab last point of polyPoints to add marker
  
      marker = new GMarker(polyPoints[polyPoints.length -1]);
  
      map.addOverlay(marker);

      map.addOverlay(polyShape);

      }

</script>

</body>
 
</html>
ASKER CERTIFIED SOLUTION
scrathcyboy

Our community of experts have been thoroughly vetted for their expertise and industry experience.

Join our community to see this answer!
Unlock 1 Answer and 8 Comments.
Start Free Trial
Learn from the best

Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.

Andrew Hancock - VMware vExpert
See if this solution works for you by signing up for a 7 day free trial.
Unlock 1 Answer and 8 Comments.
Try for 7 days

”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.

-Mike Kapnisakis, Warner Bros