Javascript 谷歌地图没有出现在div中_Javascript_Google Maps

Javascript 谷歌地图没有出现在div中

javascript google-maps

Javascript 谷歌地图没有出现在div中,javascript,google-maps,Javascript,Google Maps,我有以下代码用于在php页面中显示GoogleMap <script> var directionsDisplay, directionsService, map; function initialize() { var directionsService = new google.maps.DirectionsService(); directionsDisplay = new google.maps.DirectionsRenderer(); var chica

我有以下代码用于在php页面中显示GoogleMap

<script>

var directionsDisplay,
directionsService,
map;

function initialize() { 
  var directionsService = new google.maps.DirectionsService();
  directionsDisplay = new google.maps.DirectionsRenderer();
  var chicago = new google.maps.LatLng(51.508742,-0.120850);
  var mapOptions = { zoom:16, mapTypeId: google.maps.MapTypeId.ROADMAP, center: chicago }
  map = new google.maps.Map(document.getElementById("googlemap"), mapOptions);
  var marker=new google.maps.Marker({
     position:chicago,
     visible:true
  });

 marker.setMap(map);
 directionsDisplay.setMap(map);
 }
 </script>
 <script src="https://maps.googleapis.com/maps/api/js?v=3&callback=initialize">

jquery对话框包含jquery选项卡插件。

这是您的代码

API中缺少的

包含@geocodezip建议的类似内容

和工作

    <!DOCTYPE html>
    <html>
      <head>
        <title>Test</title>
      </head>
      <body>
        <div name="mapdetail" value="" id="googlemap"
        style="width:350px;height:300px;"class="" ></div>

        <script>

        var directionsDisplay,
        directionsService,
        map;

        function initialize() { 
          var directionsService = new google.maps.DirectionsService();
          directionsDisplay = new google.maps.DirectionsRenderer();
          var chicago = new google.maps.LatLng(51.508742,-0.120850);
          var mapOptions = { zoom:16, mapTypeId: google.maps.MapTypeId.ROADMAP, center: chicago }
          map = new google.maps.Map(document.getElementById("googlemap"), mapOptions);
          var marker=new google.maps.Marker({
             position:chicago,
             visible:true
          });

         marker.setMap(map);
         directionsDisplay.setMap(map);
         }
         </script>
         <script src="https://maps.googleapis.com/maps/api/js?v=3&callback=initialize"></script>
        </body>
    </html>


试验
变量方向显示，
指导服务，
地图；
函数初始化（）{
var directionsService=new google.maps.directionsService（）；
directionsDisplay=new google.maps.DirectionsRenderer（）；
var chicago=new google.maps.LatLng（51.508742，-0.120850）；
var mapOptions={zoom:16，mapTypeId:google.maps.mapTypeId.ROADMAP，center:chicago}
map=new google.maps.map（document.getElementById（“googlemap”）、mapOptions）；
var marker=new google.maps.marker({
职位：芝加哥，
可见：正确
});
marker.setMap（map）；
方向显示.setMap（地图）；
}

如果您有关于此错误的更多信息，我建议您发布。例如，你的javascript控制台怎么说。@JonList控制台没有显示任何错误。你的“真实”代码是否也缺少API include上的结束标记？

？请发布一个显示问题的帖子。@geocodezip我已经修改了代码

if(!window.google||!window.google.maps){
  var script = document.createElement('script');
  script.type = 'text/javascript';
  script.src = 'https://maps.googleapis.com/maps/api/js?v=3&' +
    'callback=initialize';
   document.body.appendChild(script);
}
 else{
 initialize();
 }

    <!DOCTYPE html>
    <html>
      <head>
        <title>Test</title>
      </head>
      <body>
        <div name="mapdetail" value="" id="googlemap"
        style="width:350px;height:300px;"class="" ></div>

        <script>

        var directionsDisplay,
        directionsService,
        map;

        function initialize() { 
          var directionsService = new google.maps.DirectionsService();
          directionsDisplay = new google.maps.DirectionsRenderer();
          var chicago = new google.maps.LatLng(51.508742,-0.120850);
          var mapOptions = { zoom:16, mapTypeId: google.maps.MapTypeId.ROADMAP, center: chicago }
          map = new google.maps.Map(document.getElementById("googlemap"), mapOptions);
          var marker=new google.maps.Marker({
             position:chicago,
             visible:true
          });

         marker.setMap(map);
         directionsDisplay.setMap(map);
         }
         </script>
         <script src="https://maps.googleapis.com/maps/api/js?v=3&callback=initialize"></script>
        </body>
    </html>