如何在MVC中显示google地图？

public ActionResult Map()
{
    // 获取地图数据
    var address = "Your Address";
    var coordinates = GetCoordinates(address);

    // 传递地图数据给视图
    ViewBag.Latitude = coordinates.Latitude;
    ViewBag.Longitude = coordinates.Longitude;

    return View();
}

private Coordinates GetCoordinates(string address)
{
    // 使用Google Maps Geocoding API获取经纬度坐标
    // 这里省略具体的实现，可以参考Google Maps Geocoding API文档
    // 返回一个包含经纬度坐标的对象
    return new Coordinates { Latitude = 123.456, Longitude = 789.012 };
}

public class Coordinates
{
    public double Latitude { get; set; }
    public double Longitude { get; set; }
}

<div id="map" style="width: 100%; height: 400px;"></div>

<script>
    function initMap() {
        // 获取地图数据
        var latitude = @ViewBag.Latitude;
        var longitude = @ViewBag.Longitude;

        // 创建地图对象
        var map = new google.maps.Map(document.getElementById('map'), {
            center: { lat: latitude, lng: longitude },
            zoom: 12
        });

        // 在地图上添加标记
        var marker = new google.maps.Marker({
            position: { lat: latitude, lng: longitude },
            map: map,
            title: 'Your Location'
        });
    }
</script>

<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap" async defer></script>