How to integerate Google maps in ASP MVC

See more:

ASP

Javascript

MVC5

I am learning ASP MVC and I want to include Google Maps showing the location when I notice the adress in the Contact Page.

What I have tried:

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
<link href="~/Content/Site.css" rel="stylesheet" />
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?
 sensor=false"></script>


<script type="text/javascript">

    function initialize() {

        var canvas = $("#map_canvas");

        var latitude = 35.78334;
        var longitude = 51.42511;

        var latlng = new google.maps.LatLng(latitude, longitude);
        var options = {
            zoom: 8,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(canvas[0], options);

        var marker = new google.maps.Marker({
            position: new google.maps.LatLng(latitude, longitude),
            map: map
        });
    }

    $(function () {
        initialize();
    });

  </script>

and in the view :

<div style="width: 100%; height: 100%">
    <div id="map_canvas" style="width:100%; height:100%; margin-left:   100px"></div>
 </div>