Intigrating google map in asp.net with animation

Reply

vij84

None

0 Points

26 Posts

Intigrating google map in asp.net with animation

Feb 19, 2010 08:40 AM|vij84|LINK

Hi,

This is Vijay.I have a requirement to show the google map in our GPS application with animation(vehicles with moving). I found below java script code in google. How to pass longitude and latitude values to the below javascript.

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <title>Google Maps</title>
<script src="http://maps.google.com/maps?file=api&v=<%=GoogleMapObject.APIVersion %>&key=<%=GoogleMapObject.APIKey %>" type="text/javascript"></script>
    <script src="epoly.js" type="text/javascript"></script>
</head>
<body onunload="GUnload()">

    <div id="controls">
     <form onsubmit="start();return false" action="#">
      Enter start and end addresses.<br />
      <input type="text" size="80" maxlength="200" id="startpoint" value="17.3850412323" /><br />
      <input type="text" size="80" maxlength="200" id="endpoint" value="78.4866743244" /><br />
      <input type="submit" value="Start" />
     </form>
    </div>

    <div id="map" style="width: 700px; height: 500px"></div>
    <div id="step"> </div>
    <div id="distance">Miles: 0.00</div>

      map.setCenter(new GLatLng(document.getElementById("startpoint").value, document.getElementById("endpoint").value), 13);
      var dirn = new GDirections();
      var step = 5; // metres
      var tick = 100; // milliseconds
      var poly;
      var eol;
      var car = new GIcon();
      car.image = "RedCar.png"
          car.iconSize=new GSize(32,18);
          car.iconAnchor=new GPoint(16,9);
      var marker;
      var k=0;
      var stepnum=0;
      var speed = "";

      GEvent.addListener(dirn,"load", function() {
        document.getElementById("controls").style.display="none";
        poly=dirn.getPolyline();
        eol=poly.Distance();
        map.setCenter(poly.getVertex(0),17);
        map.addOverlay(new GMarker(poly.getVertex(0),G_START_ICON));
        map.addOverlay(new GMarker(poly.getVertex(poly.getVertexCount()-1),G_END_ICON));
        marker = new GMarker(poly.getVertex(0),{icon:car});
        map.addOverlay(marker);
        var steptext = dirn.getRoute(0).getStep(stepnum).getDescriptionHtml();
        document.getElementById("step").innerHTML = steptext;
        setTimeout("animate(0)",2000); // Allow time for the initial map display
      });

      GEvent.addListener(dirn,"error", function() {
        alert("Location(s) not recognised. Code: "+dirn.getStatus().code);
      });

      function start() {
          var startpoint = document.getElementById("startpoint").value;
          var endpoint = document.getElementById("endpoint").value;
        dirn.loadFromWaypoints([startpoint,endpoint],{getPolyline:true,getSteps:true});
      }
    }

    // This Javascript is based on code provided by the
    // Community Church Javascript Team
    // http://www.bisphamchurch.org.uk/
    // http://econym.org.uk/gmap/

//]]>
</script>
</body>

</html>

please help me.

regards,

vijay

Reply

rtpHarry

All-Star

39486 Points

8916 Posts

Re: Intigrating google map in asp.net with animation

Feb 19, 2010 09:37 AM|rtpHarry|LINK

Hey,

you forgot to post the javascript [:)]

Reply

rtpHarry

All-Star

39486 Points

8916 Posts

Re: Intigrating google map in asp.net with animation

Feb 27, 2010 11:32 AM|rtpHarry|LINK

I didnt realise you had come back and added the code!

Ok these two lines grab the lat and lon from the two <input> boxes on the page:

var startpoint =  document.getElementById("startpoint").value;
          var endpoint = document.getElementById("endpoint").value;

if you change those lines you can assign a lat lon directly instead of taking it from the input box like

          var startpoint =  "17.3850412323";
          var endpoint = "78.4866743244";

Intigrating google map in asp.net with animation[Answered] RSS

2 replies

Shortcuts

Intigrating google map in asp.net with animation

Re: Intigrating google map in asp.net with animation

Re: Intigrating google map in asp.net with animation