Google Map Conflict Php и Javascript - PullRequest
Новая
       6

Google Map Conflict Php и Javascript

1 голос
/ 02 ноября 2011

Я создаю приложение с такой функциональностью, как

3 вкладки, созданные с использованием JavaScript:

  1. MAPview
  2. ListView
  3. Опубликовать события

Когда я загружаю страницу, действием по умолчанию является загрузка карты Google со всеми моими событиями, извлеченными из базы данных, и она работает правильно. Но когда я нажимаю на вкладку событий следующего поста, на этой карте загружается, но она не видна полностью в этом пространстве. Его тянет в один угол.

Может кто-нибудь помочь мне?

Я новичок в Google maps в PHP.

Для нажатия кнопок, которые я также сделал, используется 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>

1 Ответ

1 голос
/ 02 ноября 2011

извините, я действительно не знаю, потому что вы 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(), это выглядит как бигги.

Наконец, возможно, при обновлении до более нового API карты вам не нужен ключ для него, и он более совместим с предыдущими браузерами.

Обновление:

Если вы поместите, например, view_map() в 

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

и удалите <script>view_map()</script> изнутри div_3, должно отображаться правильно.

обе карты были инициализированы при запуске и не моглиНе проверяйте размер.

...