如何使用Node.js/Express/MongoDB將標記添加到Google地圖？

我決定本週我想學習Node.js（我不是程序員）。到目前爲止，我一直有很多的樂趣，但我現在卡住了。如何使用Node.js/Express/MongoDB將標記添加到Google地圖？

我使用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 
     }); 
    }); 
});

然後我就可以，例如，訪問結果中（玉）視圖，並通過執行類似一一列舉：

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);

我想通標記所在的變量被創建然後設置我可以遍歷我的「文檔」，並創建和設置一個標記存儲在我的數據庫中的每個位置。也就是說，我對這個太新了，因爲頭腦中的腳本無法訪問我傳遞給視圖的'文檔'，所以我似乎無法弄清楚如何去做。

有什麼建議嗎？在此先感謝，非常感謝。

來源

2013-08-06 Darryl Young

I 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);

來源

2013-08-06 19:49:21 Plato

謝謝你的建議，它的大加讚賞。對不起，花了很長時間才能回來接受，但現在至少已經完成了。我用你的想法，並在包含地圖的div的數據屬性中附加位置。一旦我瀏覽了數據併爲每個位置創建了一個針，我就刪除了數據屬性。在那裏沒有任何敏感的東西，但它有點乾淨，我仍然在視圖上有位置，但是在渲染地圖之前創建的數組中。再次感謝！ –

太棒了！樂意效勞！ – Plato

@Plato如何在地圖上添加多個標記？我需要AJAX嗎？我使用HTML/EJS而不是玉石。 –

如何使用Node.js/Express/MongoDB將標記添加到Google地圖？

回答

相關問題