Question

我正在尝试为django网站显示谷歌地图。我粗略地有一个模板

{% extends "base.html" %}
{% load staticfiles %}

{% block content %}
...
<div class="col-md-6">
   <div id="map_canvas" style="width:100%;height:400px;background-color:#CCC;"></div>
</div>
...
<script src="https://maps.googleapis.com/maps/api/js"></script>
<script>
  function initialize() {
    var mapCanvas = document.getElementById('map_canvas');
    var mapOptions = {
      center: new google.maps.LatLng(44.5403, -78.5463),
      zoom: 8,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var map = new google.maps.Map(map_canvas, map_options);
  }
</script>


{% endblock%}

当我重新加载网页时，我可以看到正在为Google的地图网址发出请求，但我看不到地图，只是一个简单的灰色背景。

Answer 1

我在html代码中遇到同样的问题我删除了<!DOCTYPE html>并且它可以正常工作

Answer 2

您只需在关闭脚本标记之前添加该行：

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

您可以在Documentation

中看到它

Google地图未在django模板中显示

2 个答案: