在Google Map脚本中填充PHP无法正常工作

时间:2014-08-15 03:06:24

标签: php google-maps

我确定这是一个简单的问题,但我似乎无法找到答案。我想简单地使用动态lat& amp;很久从php调用。

当我有这个代码时,它可以工作:

     <style>
      html, body, #map-canvas {
        height: 100%;
        margin: 0px;
        padding: 0px
      }
    </style>

 <script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
    <script>
function initialize() {
  var bryantPark = new google.maps.LatLng(37.869260, -122.254811);
  var panoramaOptions = {
    position: bryantPark,
    pov: {
      heading: 165,
      pitch: 0
    },
    zoom: 1
  };
  var myPano = new google.maps.StreetViewPanorama(
      document.getElementById('map-canvas'),
      panoramaOptions);
  myPano.setVisible(true);
}

google.maps.event.addDomListener(window, 'load', initialize);

    </script>


    <div id="map-canvas"></div>

然而,当我更新它以便LatLng是动态的,如下所示的php调用:

<?php include("inc/conn.php"); ?>

...

 <style>
      html, body, #map-canvas {
        height: 100%;
        margin: 0px;
        padding: 0px
      }
    </style>

 <script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
    <script>
function initialize() {
  var bryantPark = new google.maps.LatLng(<?=$row["field_Latitude"]?>, <?=$row["field_Longitude"]?>);
  var panoramaOptions = {
    position: bryantPark,
    pov: {
      heading: 165,
      pitch: 0
    },
    zoom: 1
  };
  var myPano = new google.maps.StreetViewPanorama(
      document.getElementById('map-canvas'),
      panoramaOptions);
  myPano.setVisible(true);
}

google.maps.event.addDomListener(window, 'load', initialize);

    </script>


    <div id="map-canvas"></div>

当我查看源代码时,我看到了lat&amp;很长,但街道视图应该是一个灰色的盒子。

有什么想法?

谢谢!

2 个答案:

答案 0 :(得分:0)

首先,我将使用<?php echo $row[...]; ?>代替<?= $row[...] ?>,以确保代码在short tags禁用的情况下也能正常工作。

其次,我会说:

<?php
$row = array(
    'field_Latitude'  => 37.869260,
    'field_Longitude' => -122.254811
);
?>

而不是include来电并检查结果以验证我在包含的文件中是否有错误。

在任何情况下,您都应该检查生成的HTML并检查传递给LatLong而不是预期的实际参数是什么。

答案 1 :(得分:0)

如果您想在街景视图不可用时显示地图(假设半径50米范围内没有全景图时街景视图不可用),请创建地图并请求streetViewService检查是否有可用的全景图对于给定的位置。

如果是,请设置全景图的位置并显示,否则不执行任何操作。

function initialize() {
      //center of the map and position of the panorama (when available)
  var center          = new google.maps.LatLng(42.698776, -86.181015),

      //first initialize the map
      map             = new google.maps.Map(
                                            document.getElementById('map-canvas'),
                                            {
                                              zoom:21,
                                              center:center,
                                              mapTypeId:google.maps.MapTypeId.SATELLITE
                                            }
                                           ),
      svService       = new google.maps.StreetViewService(),
      panoramaOptions = {
                            pov: {
                                  heading: 165,
                                  pitch: 0
                              },
                            zoom: 1,
                            visible:true
                        };
        //test whether a panorama is available 
      svService.getPanoramaByLocation(center, 50, function(data,status){

          if(status==google.maps.StreetViewStatus.OK){
              //panorama is available, show it
              var sv=map.getStreetView();
              sv.setPosition(center);
              sv.setOptions(panoramaOptions);
          }

      });
}

演示:http://jsfiddle.net/doktormolle/7noptz5x/