2017-06-13 58 views
0

當我試圖在我的web上顯示組織的所有公司的地圖時遇到問題。initMap不是函數4

當我去我的網站,我看到地圖不顯示。 我要檢查項目,並且出現錯誤「initMap不是函數」。

我不知道爲什麼這個錯誤是由於。 你能幫我嗎?

我附上代碼:

<?php 
 
if($_SERVER['REMOTE_ADDR']=='80.32.126.235'){ 
 
    error_reporting(E_ALL); 
 
    ini_set('display_errors', '1'); 
 
} 
 
$json = file_get_contents('https://aplicatiuspin.cat/aplicatiu/webServices/views/?v=empreses/json&idAplicatiu=59&idEtiqueta=1&template=none'); 
 

 
$empreses = json_decode($json, true); 
 

 

 
?> 
 
<div id="map" style="height: 500px; width: 100%;"></div> 
 
<script type="text/javascript"> 
 
    function initMap() { 
 
     var map_cnt = {lat:41.563211, lng:2.008875}; 
 
     var map = new google.maps.Map(document.getElementById('map'), { 
 
      zoom: 6, 
 
      center: map_cnt, 
 
      scrollwheel: false 
 
     }); 
 
     var mapBound = new google.maps.LatLngBounds(); 
 
     var mapInfoWindow = new google.maps.InfoWindow(); 
 
     <?php 
 
     foreach ($empreses as $e) { 
 
     if (is_numeric($e['latitud']) && is_numeric($e['longitud'])) { 
 
     ?> 
 
     var marker<? echo $e['id'];?> = new google.maps.Marker({ 
 
      position: new google.maps.LatLng(<? echo $e['latitud'];?>, <? echo $e['longitud'];?>), 
 
      map: map, 
 
      title: '<? echo addslashes($e['nom']); ?>' 
 
     }); 
 
     mapBound.extend(marker<? echo $e['id'];?>.getPosition()); 
 
     google.maps.event.addListener(marker<? echo $e['id'];?>, "click", function() { 
 
      var tmp = jQuery("#divEmpresa<?=$e['id']; ?>"); 
 
      tmp.popup('show'); 
 
     }); 
 

 
     map.fitBounds(mapBound); 
 
     <? 
 
     } 
 
     } 
 
     ?> 
 
    } 
 
</script> 
 
<script async defer 
 
     src="https://maps.googleapis.com/maps/api/js?callback=initMap"> 
 
</script> 
 
<script src="/webServices/views/js/jquery.popupoverlay.js"></script> 
 
<div style="overflow: hidden; height: 1px; width: 1px;"> 
 
<?php 
 
foreach ($empreses as $e):?> 
 
     <div class="divEmpresa" id="divEmpresa<?=$e['id']; ?>" style="background-color: #ffffff; padding: 20px; border-radius: 5px; width: 50%;"> 
 
      <div style="text-align: right; padding: 0 5px;"> 
 
       <a href="#" class="divEmpresa<?=$e['id']; ?>_close" > 
 
        <i class="fa fa-times" aria-hidden="true"></i> 
 
       </a> 
 
      </div> 
 
      <div class="row"> 
 
       <!--<div class="col-sm-4"><img src="/webServices/views/img/empresa<?=$e['id']; ?>.jpg"> </div>--> 
 
       <div class="col-sm-8"><h2><?=$e['nom']; ?></h2></div> 
 
      </div> 
 
      <div class="row"> 
 
       <div class="col-sm-4"></div> 
 
       <div class="col-sm-8"> 
 
        <?=$e['adreca']; ?><br> 
 
        <?=$e['cp']; ?> - <?=$e['poblacio']; ?> <br> 
 
        <?=$e['telefon']; ?><br> 
 
        <a href="<?=$e['web']; ?>" target="_blank"><?=$e['web']; ?></a> 
 
       </div> 
 
      </div> 
 
     </div> 
 
<? 
 
endforeach; 
 
?> 
 
</div> 
 
    <script> 
 
     jQuery(document).ready(function() { 
 
      jQuery('.divEmpresa').popup({ 
 
       transition: 'all 0.3s', 
 
       scrolllock: true 
 
      }); 
 
     }); 
 
    </script>

回答

0

更新的代碼

<?php 
if($_SERVER['REMOTE_ADDR']=='80.32.126.235'){ 
    error_reporting(E_ALL); 
    ini_set('display_errors', '1'); 
} 
$json = file_get_contents('https://aplicatiuspin.cat/aplicatiu/webServices/views/?v=empreses/json&idAplicatiu=59&idEtiqueta=1&template=none'); 

$empreses = json_decode($json, true); 


?> 
<div id="map" style="height: 500px; width: 100%;"></div> 
<script type="text/javascript"> 
    function initMap() { 
     var map_cnt = {lat:41.563211, lng:2.008875}; 
     var map = new google.maps.Map(document.getElementById('map'), { 
      zoom: 6, 
      center: map_cnt, 
      scrollwheel: false 
     }); 
     var mapBound = new google.maps.LatLngBounds(); 
     var mapInfoWindow = new google.maps.InfoWindow(); 
     <?php 
     foreach ($empreses as $e) { 
     if (is_numeric($e['latitud']) && is_numeric($e['longitud'])) { 
     ?> 
     var marker<? echo $e['id'];?> = new google.maps.Marker({ 
      position: new google.maps.LatLng(<? echo $e['latitud'];?>, <? echo $e['longitud'];?>), 
      map: map, 
      title: '<? echo addslashes($e['nom']); ?>' 
     }); 
     mapBound.extend(marker<? echo $e['id'];?>.getPosition()); 
     google.maps.event.addListener(marker<? echo $e['id'];?>, "click", function() { 
      var tmp = jQuery("#divEmpresa<?=$e['id']; ?>"); 
      tmp.popup('show'); 
     }); 

     map.fitBounds(mapBound); 
     <? 
     } 
     } 
     ?> 
    } 
</script> 

<script async defer src="https://maps.google.com/maps/api/js?v=3.25&key=enter-your-key-here&callback=initMap"></script> 
<script src="https://code.jquery.com/jquery-1.8.2.min.js"></script> 
<script src="https://cdn.rawgit.com/vast-engineering/jquery-popup-overlay/1.7.13/jquery.popupoverlay.js"></script> 


<div style="overflow: hidden; height: 1px; width: 1px;"> 
<?php 
foreach ($empreses as $e):?> 
     <div class="divEmpresa" id="divEmpresa<?=$e['id']; ?>" style="background-color: #ffffff; padding: 20px; border-radius: 5px; width: 50%;"> 
      <div style="text-align: right; padding: 0 5px;"> 
       <a href="#" class="divEmpresa<?=$e['id']; ?>_close" > 
        <i class="fa fa-times" aria-hidden="true"></i> 
       </a> 
      </div> 
      <div class="row"> 
       <!--<div class="col-sm-4"><img src="/webServices/views/img/empresa<?=$e['id']; ?>.jpg"> </div>--> 
       <div class="col-sm-8"><h2><?=$e['nom']; ?></h2></div> 
      </div> 
      <div class="row"> 
       <div class="col-sm-4"></div> 
       <div class="col-sm-8"> 
        <?=$e['adreca']; ?><br> 
        <?=$e['cp']; ?> - <?=$e['poblacio']; ?> <br> 
        <?=$e['telefon']; ?><br> 
        <a href="<?=$e['web']; ?>" target="_blank"><?=$e['web']; ?></a> 
       </div> 
      </div> 
     </div> 
<? 
endforeach; 
?> 
</div> 
    <script> 
     jQuery(document).ready(function() { 
      jQuery('.divEmpresa').popup({ 
       transition: 'all 0.3s', 
       scrolllock: true 
      }); 
     }); 
    </script> 

你必須創建一個谷歌的API密鑰,並將其粘貼到「輸入 - 您的琴鍵這裏'地方。

要創建谷歌API密鑰點擊以下鏈接

https://developers.google.com/maps/documentation/javascript/get-api-key

乾杯!

+0

這應該工作 – Lepanto

+0

首先,感謝你回答。 我已經替換了代碼,因此您向我提供生成的密鑰,並且它始終告訴我相同的結果... 代碼保持如下狀態:

+0

你得到的錯誤是什麼? – saravana

0

你必須忘記添加google-api-key如下所示。

讓您YOUR_API_KEY這裏加入吧..

<script async defer 
    src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"> 
    </script> 
相關問題