【发布时间】:2017-03-06 14:58:09
【问题描述】:
我正在尝试使用我的 mongodb 集合显示地图位置,问题只是能够从 mongodb 访问一个数据,尝试从服务器端和客户端客户端循环以显示数据但失败。这里是代码:
来自 https://gist.github.com/parth1020/4481893
的示例代码script(type='text/javascript').
var locations = [
['Bondi Beach', -33.890542, 151.274856, 4],
['Coogee Beach', -33.923036, 151.259052, 5],
['Cronulla Beach', -34.028249, 151.157507, 3],
['Manly Beach', -33.80010128657071, 151.28747820854187, 2],
['Maroubra Beach', -33.950198, 151.259302, 1]
];
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 10,
center: new google.maps.LatLng(-6.2674807,106.8066466),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow();
var marker, i;
for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1], locations[i][2]),
map: map
});
google.maps.event.addListener(marker, 'click', (function (marker, i) {
return function () {
infowindow.setContent('<h3>' + '#{egstation.loc}'+ '</h3>\n' +
'<p>Navigasi</p>');
infowindow.open(map, marker);
}
})(marker, i));
}
没有循环:成功
快递:
router.get('/', auth.check_login, function(req, res, next) {
session_store = req.session;
Egstation.find(function(err, data){
if (err) throw err;
console.log(data);
res.render('index', {
title: 'EGShare | Energy Sharing Platform',
session_store:session_store,
egstation: data
});
}).select('name lat lng loc');
});
console.log(数据)的输出:
{
"_id" : ObjectId("58b78132c44b37103cc54180"),
"name" : "egstation 1",
"lat" : -6.2674807,
"lng" : 106.8066466,
"loc" : "Makedonia MakerSpace Jalan Pangeran Antasari No.44 RT.7 RW.7",
"__v" : 0
}
{
"_id" : ObjectId("58bd564b4bf9ea905c53ee72"),
"name" : "egstation 2",
"lat" : -5.2345634,
"lng" : 124.2453456,
"loc" : "Ngasal"
}
我的 index.pug
script(type='text/javascript').
var locations = [
['Bondi Beach', -33.890542, 151.274856, 4],
['Coogee Beach', -33.923036, 151.259052, 5],
['Cronulla Beach', -34.028249, 151.157507, 3],
['Manly Beach', -33.80010128657071, 151.28747820854187, 2],
['Maroubra Beach', -33.950198, 151.259302, 1]
];
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 10,
center: new google.maps.LatLng(-6.2674807,106.8066466),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow();
var marker, i;
for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng('#{egstation[0].lat}', '#{egstation[0].lng}'),
map: map
});
google.maps.event.addListener(marker, 'click', (function (marker, i) {
return function () {
infowindow.setContent('<h3>' + '#{egstation[0].loc}'+ '</h3>\n' +
'<p>Navigasi</p>');
infowindow.open(map, marker);
}
})(marker, i));
}
客户端中的循环不起作用
for (i = 0; i < '#{egstation.length}'; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng('#{egstation[i].lat}', '#{egstation[i].lng}'),
map: map
});
google.maps.event.addListener(marker, 'click', (function (marker, i) {
return function () {
infowindow.setContent('<h3>' + '#{egstation[i].loc}'+ '</h3>\n' +
'<p>Navigasi</p>');
infowindow.open(map, marker);
}
})(marker, i));
}
错误输出
TypeError: /home/mda/WebstormProjects/egsharev/views/index.pug:265
263| for (i = 0; i < '#{egstation.length}'; i++) {
264| marker = new google.maps.Marker({
> 265| position: new google.maps.LatLng('#{egstation[i].lat}', '#{egstation[i].lng}'),
266| map: map
267| });
268| google.maps.event.addListener(marker, 'click', (function (marker, i) {
Cannot read property 'lat' of undefined
服务器端的循环不能正常工作
router.get('/', auth.check_login, function(req, res, next) {
session_store = req.session;
Egstation.find(function(err, data){
if (err) throw err;
for (var i = 0; i < data.length; i++){
egstation.name = data[i].name;
egstation.lat = data[i].lat;
egstation.lng = data[i].lng;
egstation.loc = data[i].loc;
res.render('index', {
title: 'EGShare | Energy Sharing Platform',
session_store:session_store,
egstation: egstation
});
}
}).select('name lat lng loc');
});
帮帮我,谢谢。
【问题讨论】:
标签: node.js mongodb google-maps express pug