James Wilson
James Wilson

Reputation: 5150

How to get asp.net mvc controller to talk with google maps api - Adding markers dynamically

I am working with the Google Maps API. I have the map displaying on my page, I can add markers to it manually, everything is working correctly.

Now I need to build a marker list from mvc and figure out how to pass it back to the map through asp.net MVC. Everything I need for the marker list is contained in the dtDealer_List shown below.

foreach (DataRow row in dtDealer_List.Rows)
      {
          dealer_list dl = new dealer_list();
          dl.address = row["address"].ToString();
          .......
          lstDealer_List.Add(dl);
      }

I'm not sure on how to pass this list back to the javascript function.

function init_map(map_canvas_id, lat, lng, zoomLevel) {
            var myLatLng = new google.maps.LatLng(lat, lng);

            var options = {
                zoom: zoomLevel,
                center: myLatLng,
                mapTypeId: google.maps.MapTypeId.HYBRID
            };

            var map_canvas = document.getElementById(map_canvas_id);

            var map = new google.maps.Map(map_canvas, options);
        }

Do I need to pull out the dtDealer_List into a ajax call or something?

Upvotes: 1

Views: 1302

Answers (1)

Jonesopolis
Jonesopolis

Reputation: 25370

add a small script at the top of your page to set up a javascript array from your list:

@model List<string>

<script>
    var addresses = [];
    @foreach (var address in Model)
    {
        <text>addresses.push('@address')</text>
    }
    console.log(addresses);
</script>

then you should be able to access the global addresses array where you need

Upvotes: 1

Related Questions