谷歌地图 API 和 C#答案

【问题标题】：GoogleMaps Api and C#谷歌地图 API 和 C#
【发布时间】：2011-06-11 10:30:26
【问题描述】：

我的地图有问题。地图在大约 5 个月前正常工作。现在，当我用我的坐标加载地图时，地图正在加载，但是当我开始浏览地图、缩放等时，我得到了白屏，就像与地图没有连接一样。我需要再次加载地图，但同样的问题再次发生.大约 5 个月前，我正在使用这个脚本，一切正常。浏览、缩放、更改地图类型，一切都没有任何问题。我根据谷歌网站创建了html代码并将其放入新的资源文件中：

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />
<title>Google Maps JavaScript API v3 Example: Map Simple</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">



  function load(latitude,longitude,zoomik) {
    var myLatlng = new google.maps.LatLng(latitude,longitude);
    var myOptions = {
      zoom: zoomik,
      center: myLatlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }


    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    var marker = new google.maps.Marker({
        position: myLatlng, 
        map: map,
        title:"Here!"});

  }

</script>
</head>
<body onload="load()">
  <div id="map_canvas"></div>
</body>
</html>

我的按钮代码是：

  private void TestButton_Click(object sender, EventArgs e)
    {
        webBrowser1.Document.InvokeScript("load", new object[] { -34.397, 150.644, 8 });
    }

屏幕：地图加载正确：

使用平移工具或缩放工具后： - 空白屏幕。

我正在使用来自 winforms 的 Visual C# Express 和 WebBrowser 控件。

HTML 代码在 Firefox 中正常工作（使用 Aptana Studio）（缩放和平移正常）

google api 示例中的这段代码也不能正常工作：

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css"        rel="stylesheet" type="text/css" />
<title>Google Maps JavaScript API v3 Example: Map Simple</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
 function initialize() {
    var myLatlng = new google.maps.LatLng(-34.397, 150.644);
    var myOptions = {
     zoom: 8,
     center: myLatlng,
     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"></div>
  </body>
  </html>

【问题讨论】：

标签： c# winforms google-maps-api-3 webbrowser-control

【解决方案1】：

这是我自己想出来的。

错了：

<div id="map_canvas"></div>

改成之后：

<div id="map_canvas" style="width:500px; height:400px"></div>

地图正在正常工作。

【讨论】：

【解决方案2】：

当我遇到 gMaps 问题时，我要做的第一件事就是更改地图键，你尝试过吗？您尝试过哪些浏览器？火狐、Chrome 还是 IE？

【讨论】：

嗯，我在视觉中使用来自 winforms 的 WebBrowser。 API 密钥？根据 GoogleMaps API 网站：“此版本的 Google Maps JavaScript API 不再需要 API 密钥！”。 HTML 代码在 Firefox 中正常运行。

【解决方案3】：

我在使用 Google Maps v3 时遇到了类似的问题。不过，我的问题是我的目标是当前的 Google Maps v3 API，他们“弃用”了对 set_map 的调用，并引入了与 setMap 相同的功能。

我在您的代码中没有看到任何应该被破坏的内容。如果您在此页面上有其他 JavaScript 引发错误，有时可能会导致 Google 地图无法加载。例如，如果您引用了其他一些引发未捕获异常的 JavaScript，则地图可能无法加载。

我的建议是指定 Google Maps API 的版本，而不是使用当前版本，看看是否能解决问题：

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

编辑：另外，再次查看您的帖子，您可能希望将设置标记和地图缩小的逻辑移出加载功能。这样，当您单击按钮时，您不会重新初始化地图和选项。前几天我在文档中看到地图现在有一个用于 div 内容的“清除”选项，并且两次加载地图（正文加载、按钮单击）可能会强制执行这种清除行为。同样，针对以前的 API 版本，它可能会起作用。

【讨论】：

【解决方案4】：

也许您可以改为在 Flash 中而不是在 WebBrowser 对象中加载谷歌地图？以下链接说明了如何使用 WPF 进行操作，但它应该很容易适用于 WinForms：http://code.google.com/intl/fr/apis/maps/articles/flashmapinwpf.html

【讨论】：