在ASP.Net Webforms中使用Google Maps-地图不显示

Question

我是.NET编程的初学者，我正在尝试在代码中放入Google Map。 这是我正在遵循本教程的MultiView中使用的用户控件，但无法正常使用。 有人可以弄清楚我在做什么错吗？ 我看过类似的问题，但没有找到解决方案-我指定了div的宽度和高度，在页面加载时调用了初始化函数，等等。我没有编译错误-一切正常，并且div就在那里，只是不加载地图。 我尝试在脚本标记中放入“ runat = server”，但这给了我一个编译错误。

相关代码：

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="StoreView.ascx.cs" Inherits="Practice.StoreView" %>
<asp:HiddenField ID="hdStoreName" runat="server" />
<asp:HiddenField ID="hdStateCode" runat="server" />
<div>
    <asp:Button runat="server" ID="btnBackToStatePage" Text="Back to state" OnClick="btnBackToStatePage_Click" /></div>
<div>
    <asp:Label ID="lblStorePageHeader" runat="server" Font-Size="X-Large"></asp:Label></div>
<div>
    <asp:Image runat="server" ID="imgStorefront" ImageUrl="" /></div>
<head>
<title></title>
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
    <script type="text/javascript">
        function initialize() {
            var latlng = new google.maps.LatLng(-34.397, 150.644);
            var myOptions = {
                zoom: 8,
                center: latlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };
        var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
        } 

    </script>
</head>
<body onload="initialize()">
    <div id="map_canvas" style="width: 300px; height: 300px; float: right;">
    </div> 
</body>

编辑我只是试图将地图本身呈现在HTML页面中，如下所示，并且该页面也未显示。 确实会显示“这是页面”字样，但不会显示地图。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
    <script type="text/javascript">
        function initialize() {
            var latlng = new google.maps.LatLng(-34.397, 150.644);
            var myOptions = {
                zoom: 8,
                center: latlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
        }

    </script>
</head>
<body>
    <span>This is a page.</span>
    <div id="map_canvas" style="width: 300px; height: 300px; float: right;">
    </div>
</body>
</html>

在查看应包含我的地图的ASPX页面时的“网络”标签：

查看应包含地图的HTML页面时的“网络”标签：

Answer 1

javascript函数有效，因为我尝试了它并显示了地图。 也许您还缺少其他东西？

这是我的确切页面，！[显示出来] 1

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="main.aspx.cs" Inherits="HelpAspx.main" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
    <script type="text/javascript">
        function initialize() {
           var latlng = new google.maps.LatLng(-34.397, 150.644);
           var myOptions = {
                zoom: 8,
                center: latlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP
           };
           var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
        }

    </script>
</head>
<body onload="initialize()">
   <form runat="server">
       <asp:HiddenField ID="hdStoreName" runat="server" />
       <asp:HiddenField ID="hdStateCode" runat="server" />
       <div>
       </div>
       <div>
          <asp:Label ID="lblStorePageHeader" runat="server" Font-Size="X-Large"></asp:Label>
       </div>
       <div>
           <asp:Image runat="server" ID="imgStorefront" ImageUrl="" />
       </div>
       <div id="map_canvas" style="width: 300px; height: 300px; float: right;">
       </div>
   </form>
</body>
</html>

在ASP.Net Webforms中使用Google Maps-地图不显示

问题描述

1 个解决方案

解决方案1
2 2015-08-05 14:49:28

在ASP.Net Webforms中使用Google Maps-地图不显示

问题描述

1 个解决方案

解决方案1 2 2015-08-05 14:49:28

解决方案1
2 2015-08-05 14:49:28