如何使用 Node.js/Express/MongoDB 向 Google 地图添加标记？

Question

这周我决定要学习 Node.js（我不是程序员）。到目前为止，我一直玩得很开心，但我现在被困住了。

我使用 Express 创建了一个基本应用程序。假设我有一条路线/位置。我设置了获取请求以呈现相关视图并查找（使用 Mongoose 的 .find 方法）我的位置模型中的所有文档。我知道我可以像这样将文档传递给视图：

app.get('/locations', function(req, res) {
    Location.find({}, function(err, docs) {
        res.render('locations/index', {
            title: 'Locations',
            user: req.user,
            docs: docs  
        });
   });
});

然后，例如，我可以访问 (Jade) 视图中的结果并通过执行以下操作列出它们：

if(docs.length)
    each location in docs
        p #{location.name} is at #{location.coordinates}

我想将所有这些位置（使用与每个“位置”一起存储的坐标）添加到 Google 地图中。我有一个示例地图显示在视图上，使用头部中的以下脚本，取自 Google Maps API 文档。

function initialize() {
    var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
    var mapOptions = {
        zoom: 4,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
    }
    var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
    var marker = new google.maps.Marker({
        position: myLatlng,
        title: "Hello World!"
    });
    marker.setMap(map);
}
google.maps.event.addDomListener(window, 'load', initialize);

我想出了在哪里创建标记变量然后设置我可以遍历我的“文档”并为存储在我的数据库中的每个位置创建和设置一个标记。也就是说，我对此太陌生，我似乎无法弄清楚如何去做，因为头部的脚本无法访问我传递给视图的“文档”。

有什么建议吗？提前感谢，非常感谢。

Answer 1

我 JSON.stringify() 我的客户端脚本需要的任何对象并将其作为 HTML5 data-whatever 属性插入。

例如：

//app.js
app.get('/map', function(req, res){
  var data = {
    id: '1234',
    LL: {
      lat: 42.1,
      lng: 80.8,
  };
  res.locals.docsJSON = JSON.stringify([data]);
  res.render('locations/index');
});

//jade
!!!
html
  body(data-locations=locals.docsJSON)
  script
    var docs = JSON.parse($('body').attr('data-locations'));
    console.log(docs[0].LL);