您已在此页面上多次包含Google Maps API错误尽管我没有包含

Question

我已经阅读了有关此错误的所有教程。 但是我无法解决我的问题。 我想使用Google API根据我的经度和纬度显示地图。 我添加了地图API来使用Google地图，如下所示：

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>

在_Layout.cshtml中添加此库后，出现如下错误：

You have included the Google Maps API multiple times on this page. This may cause unexpected errors.

即使未在map.cshtml文件中添加有关Google地图的任何代码，也会发生此错误。 因此，我认为此错误与Google地图代码无关。 map.cshtml文件中的Google Maps代码如下：

<script>
    $(document).ready(function () {
        InitializeMap();
    });

    function InitializeMap() {
        var data = {
            Latitude: '@Model.Latitude',
            Longitude: '@Model.Longitude'
        };
        var latlong = new google.maps.LatLng(data.Latitude, data.Longitude);
        var myOptions = {
            zoom: 12,
            center: latlong,
            mapTypeControl: true,
            scaleControl: true,
            zoomControl: true,
            zoomControlOptions: {
                position: google.maps.ControlPosition.LEFT_CENTER
            },
            fullscreenControl: true,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(document.getElementById("Map"), myOptions);
    } 
</script>

显示Google地图的div标签如下：

<div id="Map" style="width: 750px; height: 500px"></div> 

我在所有当前项目中搜索了``googleapis''一词，但找不到另一个。错误如下：

Answer 1

我最近有同样的错误。 我想根据经度和纬度显示地图。 单击“搜索”按钮时将显示该地图。 单击搜索按钮，然后将坐标发送到控制器操作方法。 然后地图显示在同一页面上。 因为我用JavaScript在ajax中调用控制器动作。 这样两个视图页面都在同一视图上。 每次我收到此错误。 我在index.html中的搜索按钮如下：

<button type="button" id="btnSearch" class="btn btn-warning" style="height:35px;width:120px">
                    <i class="fa fa-search" aria-hidden="true"></i>
                    <translate>Search</translate>
</button>

我的ajax调用位于index.html中，如下所示：

$('#btnSearch').click(function () {      
            $.ajax({
                url: '@Url.Action("Search", "ControllerName")',
                data: { Name: $('#Name').val() },
                type: 'POST',
                success: function (data) {
                    $("#mapSupriseForm").html(data);
                }
            });
    });

Map在index.html中以“ mapSupriseForm”惊奇形式显示。 它在下面：

<div id="mapSupriseForm"></div>

谷歌地图代码在search.cshtml中。 Search.cshtml显示在index.cshtml中。 即index.cshtml和search.cshtml是同一位置。 我将google maps api库添加到_Layout.cshtml。 Search.cshtml和index.cshtml使用_Layout.cshtml作为部署。 这样就可以多次添加google maps api，然后浏览器就会抛出错误。 Search.cshtml在index.cshtml中，因此search.cshtml不应添加_Layout.cshtml。 由于index.cshtml，search.cshtml已经使用_Layout.cshtml。 由于所有这些原因，我禁用了search.cshtml的布局，如下所示：

@{
    ViewBag.Title = "Search";
    Layout = "";
} 

这样，Google Maps API库就被添加了一次。 错误已解决。 我希望这种经验可以帮助您解决问题。