在Javascript中添加带有DJango模板标签的Google地图标记

Question

我正在尝试使用Django模板标签变量作为纬度和经度将一堆地图标记添加到地图中，但事情并不顺利。 这是我在视图javascript代码中的内容。 我将代码作为外部JS文件加载。 这是我必须初始化一切。 此外，当我这样做时，谷歌地图甚至没有显示出来。 它消失了。

 function initialize() {
            var latLng = new google.maps.LatLng(41.85, -87.65);

            map = new google.maps.Map(document.getElementById('map_canvas'), {
                zoom: 8,
                center: latLng,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            });



             marker = new google.maps.Marker({
                position: latLng,
                title: 'Point A',
                map: map,
                draggable: true
            });

            // Update current position inf o and load in markers from database
            loadMarkers();
            updateMarkerPosition(latLng);
            geocodePosition(latLng);

这就是loadMarkers（）的样子

            function loadMarkers(){
            {% for mark in latest_marks %}
            var point = new google.maps.LatLng({{mark.lat}},{{mark.lng}});
                var marker = new google.maps.Marker({
                position: point,
                map: map,
            });
            {% endfor %}    
        }

任何帮助，将不胜感激。 干杯。

Answer 1

你不能把Django模板标签放在外部javascript文件中。 Django甚至没有看到那些。 您的网络服务器直接为客户提供服务。

你可以做的是使用Django生成Javascript变量和数据结构，例如在模板中的<script>标签内，然后你的外部javascript文件可以引用那些就好了。

例如，在您的模板中，您可以生成Django：

<script>var myVar = {something: 42};</script>

然后您的外部JavaScript文件可以使用myVar 。 我这么做很多，以自定义外部JavaScript脚本的行为。

而且，正如我在评论中提到的，你有一个尾随的逗号： map: map, . 这将产生错误并停止您的脚本。

Answer 2

很可能您的javascript代码中存在错误，导致Google Maps api无法执行。 你的代码确实很容易发现javascript错误：正如Brian Neal指出的那样，python中的dict文字与ecmascript中的对象文字非常相似，但有一个微妙的区别：

虽然python在最后一个元素之后允许额外的逗号，但javascript却没有。

这适用于python：

{ 
   'position': point, 
   'map': map, 
}

但是在javascript中，这会因语法错误而失败：

{ 
   position: point, 
   map: map, 
}

解决此问题，然后重试。

每个现代网络浏览器都有不错的javascript调试资源。 Chrome有一个非常好的，Firefox有firebug（IE的最后一个版本也相当不错）。 如果您需要进一步的帮助，请查看javascript控制台并告诉我们您看到的错误。

[编辑]

为了解释django模板标签，您必须从django视图而不是静态文件中提供javscript文件。

在urls.py中，包含javascript的条目：

      (r'jsresources/latest_points.js', 'yourappname.views.latest_points') 

在yourappname / views.py中执行以下操作：

def latest_points(request):
    latest_points = YourPointsModel.objects.order_by('-id')[100]
    return render_to_response('latest_points.js', locals(), mimetype='text/javascript')