Googlemap control for Asp.Net MVC

DataBinding To Model

About this example

This example shows how to databind Googlemap Control for ASP.NET MVC.

The required steps are:

  1. Pass an IEnumerable<T> to the view:

    public ActionResult DataBindingToModel()
    {
        IEnumerable<RegionInfo> data = DataContext.GetRegions();
        return View(data);
    }
        
  2. Pass the collection as the first parameter of the BindTo method. The second parameter is an Action<MapObjectBindingFactory<Shape>> which is used to define mappings between objects and Google Shapes.
    The For<T> method is used to configure the binding. The ItemDataBound method maps properties of T to Shape.

    Here is a Googlemap declaration showing how to bind the component to IEnumerable<Shape>

    @( Html.Googlemap()
            .Name("map")
            .BindTo<RegionInfo, Circle>
            (Model, mappings => 
            {
                mappings.For<RegionInfo>(binding => binding
                        .ItemDataBound(circle, regionInfo) =>
                        {
                            circle.Center = new Location(obj.Latitude,regionInfo.Longitude);
                            circle.Radius = (int) regionInfo.population/50;                     
                        })
                );
            })
    )