当前位置: 首页 > 面试题库 >

当嵌套在div标签中时,地图未显示在Google Maps JavaScript API v3上

颛孙建业
2023-03-14
问题内容

我正在尝试将div用于显示地图(<div id="map- canvas"></div>)的标签放在另一个标签中div,但它不会以这种方式显示地图。是CSS还是JavaScript问题?还是仅仅是API的工作方式?

这是带有嵌套的代码div

<!DOCTYPE html>
<html>
  <head>
    <title>Simple Map</title>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <style>
        html, body, #map-canvas {
            margin: 0;
            padding: 0;
            height: 100%;
        }
    </style>
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false">
    </script>
    <script>
        var map;
        function initialize() {
          var mapOptions = {
            zoom: 8,
            center: new google.maps.LatLng(-34.397, 150.644),
            mapTypeId: google.maps.MapTypeId.ROADMAP
          };
          map = new google.maps.Map(document.getElementById('map-canvas'),
              mapOptions);
        }

        google.maps.event.addDomListener(window, 'load', initialize);
    </script>
</head>
<body>
    <div> <!-- ommiting this div will show the map -->
        <div id="map-canvas"></div>
    </div>
</body>
</html>

问题答案:

添加style="width:100%; height:100%;"到div看看有什么用

不是到#map_canvas主分区

<body>
    <div style="height:100%; width:100%;">
         <div id="map-canvas"></div>
    </div>
</body>

这里还有其他答案,解释了为什么这样做是必要的



 类似资料:
  • 在我的JSP中,我有一个下拉列表来列出所有可用的部门,当客户端选择一个部门时,通过AJAX,我将所有员工的列表放在下一个下拉列表中。 出于AJAX的目的,我使用 ,而不是Employment name Employer id。所以有人能告诉我如何在onchange事件中获取<code>HashMap</code>的值吗。

  • 我有一个使用JavaFX任务显示一些数据的折线图: 当我有空数据时,我很感兴趣,因为我必须插入行值,如何在图表中显示标签“无数据”? 有没有这样的例子

  • 我最近更新了我的charts.js库到最新版本(2.5.0)。这个版本不显示图表上的标签。 我有一个在《小提琴手:http://jsfiddle.net/g6fajwg8》上工作的例子。 但是,我完全按照示例中的方式定义了我的图表,但仍然看不到图表上的标签。 注意:在Google和Stackoverflow上有很多这样的问题,但其中大多数都是关于以前的版本,这些版本在它们上运行良好。

  • 模板引擎支持标签的多层嵌套功能,可以对标签库的标签指定可以嵌套。 系统内置的标签中,volist、switch、if、elseif、else、foreach、compare(包括所有的比较标签)、(not)present、(not)empty、(not)defined等标签都可以嵌套使用。例如: <volist name="list" id="vo"> <volist name="vo['

  • 请参考:http://www.kancloud.cn/manual/thinkphp/1817

  • 模板引擎支持标签的多层嵌套功能,可以对标签库的标签指定可以嵌套。 系统内置的标签中,volist、switch、if、elseif、else、foreach、compare(包括所有的比较标签)、(not)present、(not)empty、(not)defined等标签都可以嵌套使用。例如: <volist name="list" id="vo"> <volist name="vo['