Question

我正在构建一个具有

功能的应用程序

使用javascript创建3个标签：

MapView类
的ListView
发布活动

当我加载页面时，默认操作是加载Google地图，其中包含从数据库中检索到的所有事件，并且它正常运行。但是，当我单击下一个帖子事件选项卡时，该地图正在加载，但在该空间上无法完全显示。它拖到了一个角落。

有人可以帮帮我吗？

我是PHP新版Google地图。

我已经完成的按钮点击使用了javascript。

这是我的HTML代码：

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8" />
  <title>Google Maps JavaScript API Example: Simple Map</title>
  <script src="//maps.google.com/maps?file=api&amp;v=2&amp;sensor=false&amp;key=[My key goes here]" type="text/javascript"></script>
  <script type="text/javascript">
    function initialize() {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map_canvas"));
        map.setCenter(new GLatLng(37.4419, -122.1419), 13);
        map.setUIToDefault();
      }
    }

    function view_map() {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("view_canvas"));
        map.setCenter(new GLatLng(37.4419, -122.1419), 13);
        map.setUIToDefault();
      }
    }
  </script>
  <script language="javascript">
    function change_div(div_id) {
      document.getElementById('div_1').style.display = 'none';
      document.getElementById('div_2').style.display = 'none';
      document.getElementById('div_3').style.display = 'none';
      //alert(div_id);
      document.getElementById(div_id).style.display = 'block';
    }
  </script>
</head>
<body>
  <div align="center">
    <div align="left">
      <a href="javascript:void(0)" onclick="change_div('div_1')">Post Events</a> |
      <a href="javascript:void(0)" onclick="change_div('div_2')">List Events</a> |
      <a href="javascript:void(0)" onclick="change_div('div_3')">Map View</a>
    </div>
    <div align="left" id="div_1">
      <div id="map_canvas" style="width: 500px; height: 300px"></div>
      <script language="javascript">initialize();</script>
    </div>
    <div align="left" id="div_2" style="display:none">
      List Events
    </div>
    <div align="left" id="div_3" style="display:none">
      <div id="view_canvas" style="width: 500px; height: 300px"></div>
      <script language="javascript">view_map();</script>
    </div>
  </div>
</body>

</html>

Answer 1

抱歉，我真的不知道，因为你的api是旧版本，我没有钥匙而且它的工作量很大，所有我可以建议有一些东西

首先：将view_map();脚本块放在view_canvas div

中

<div align="left" id="div_3" style="display:none">
  <div id="view_canvas" style="width: 500px; height: 300px"><script language="javascript">view_map();</script></div>

</div>

第二个另一件事是你的change_div()功能看起来有点大。

最后可能是更新的Map API Uupdate，你不需要它的密钥，并且更加向后兼容旧浏览器。

<强>更新

如果您将view_map()放在

中

<a href="javascript:void(0)" onclick="change_div('div_3');view_map();">Map View</a>

并从<script>view_map()</script>中移除div_3应正确显示。

两张地图都在启动时初始化，无法检查调整大小。

Google Map Conflict Php和Javascript

1 个答案: