How to use Gmap API in ASP.NET
This article is used to add GMAP API into asp.net page.
You can also add marker and polygon using javascript. developer who work on GPS technology wil better use this code to show gmap with marker as a last status of running vehicle. Learn how to use Gmap API in ASP.NET?
Find how to use Gmap API in ASP.NET
1) Function required to add marker and set center for Gmap
it will first check is browser compatible with below function .
function loadEarth(mapdiv) {
if (GBrowserIsCompatible()) {
var point;
if (!mapdiv) return true;
var map = new GMap2(document.getElementById("map"));
var lat = document.getElementById("txtlatitude").value;
var long = document.getElementById("txtlongitude").value;
map.addControl(new GOverviewMapControl());
map.enableDoubleClickZoom();
map.enableScrollWheelZoom();
map.addControl(new GMapTypeControl());
map.addControl(new GSmallMapControl());
var marker = new GMarker(new GLatLng(lat, long));
map.setCenter(new GLatLng(lat, long), 15);
GEvent.addListener(marker, "click", function () {
marker.openInfoWindowHtml("hii");
});
map.addOverlay(marker);
}
}
HTML code to add GMAP control and two textbox one for latitude and other for longitude .
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<script src="http://maps.google.com/maps?file=api&v=2&
key=ABQIA" type="text/javascript"></script>
<script type="text/javascript">
function loadEarth(mapdiv) {
if (GBrowserIsCompatible()) {
var point;
if (!mapdiv) return true;
var map = new GMap2(document.getElementById("map"));
var lat = document.getElementById("txtlatitude").value;
var long = document.getElementById("txtlongitude").value;
map.addControl(new GOverviewMapControl());
map.enableDoubleClickZoom();
map.enableScrollWheelZoom();
map.addControl(new GMapTypeControl());
map.addControl(new GSmallMapControl());
var marker = new GMarker(new GLatLng(lat, long));
map.setCenter(new GLatLng(lat, long), 15);
GEvent.addListener(marker, "click", function () {
marker.openInfoWindowHtml("hii");
});
map.addOverlay(marker);
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Image ID ="img" runat="server" />
<asp:TextBox ID ="txtlatitude" runat="server" ></asp:TextBox>
<asp:TextBox ID="txtlongitude" runat ="server"></asp:TextBox>
</div<
<div id="map" style="width: 800px; height: 500px">
</div>
<input name="Submit" type="submit" value="Update" onClick="JavaScript:loadEarth('map')"/>
</form>
</body>
</html>
it will help you to add gmap control .please post your requirement for more details.
Thanks
Sagar Pawar