How to add a dynamic Google map to my site?

Question

I am developing a travel portal for India in which I want to add Google Maps for each hotel, which is stored in a database. My problem is how to create a dynamic map?

Answer 1

This is probably the best place to start:

http://code.google.com/apis/maps/documentation/introduction.html

Answer 2

The following is a basic example of using ASP.MVC to display a number of hotels on a Google map.

Domain Object - Hotel:

public class Hotel
{
    public string Name { get; set; }
    public double Longitude { get; set; }
    public double Latitude { get; set; } 
}

You will need a repository to get some of the hotel facilities. Use this in the Home Controller in the HotelsForMap () method:

public ActionResult HotelsForMap()
{
    var hotels= new HotelRepository().GetHotels();
    return Json(hotels);
}

google. GoogleMap. :

• google api

  <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAzr2EBOXUKnm_jVnk0OJI7xSosDVG8KKPE1-m51RBrvYughuyMxQ-i1QfUnH94QxWIa6N4U6MouMmBA" type="text/javascript"></script>
  

• jQuery, JSON

  $().ready(() { if (GBrowserIsCompatible()) {   $.getJSON( "/Home/HotelsForMap", ); } });

• jQuery

  initialize (mapData) {

  var map = new GMap2(document.getElementById("map_canvas"));
  map.addControl(new google.maps.SmallMapControl());
  map.addControl(new google.maps.MapTypeControl());
  
  var zoom = mapData.Zoom;
  map.setCenter(new GLatLng(mapData[0].Latitude, mapData[0].Longitude), 8);
  
  $.each(mapData, function(i, Hotel) {
      setupLocationMarker(map, Hotel);
  });
  

  }

• jQuery

  setupLocationMarker (, ) {       var latlng = new GLatLng (Hotel.Latitude, Hotel.Longitude);       var marker = GMarker (latlng);       Map.addOverlay(); }

, , . div map_canvas, . :

<h2>Hotels</h2>
<br />
<div id="map_canvas" style="width: 500; height: 500px">
     <% Html.RenderPartial("GoogleMap"); %>
</div>

, , ASP.MVC.

Answer 3

Check out this example: http://blog.sofasurfer.ch/2011/06/27/dynamic-google-map-markers-via-simple-json-file/

It dynamically adds google map markers to jSon file using google geocoder