Google地图标记未显示从数据库加载的位置

时间:2016-03-05 07:08:50

标签: javascript node.js mongodb google-maps google-maps-api-3

我正在尝试使用带有Node.js和mongodb的Google Maps API。我在Node.js上有一个快速应用程序从mongodb获取位置。我在我的网站上设置了地图。但是,它仅显示Node.js代码中硬编码的位置的标记。这是来自routes.js的代码片段

app.get('/website', function(req, res){
    website.website(function(events){
        res.render('website/index_page.ejs', {events : events});
    });
});

index_page.ejs

<!DOCTYPE html> 
<html lang="en"> 
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <% include map_head %> 
</head> 
<body>
    <h2>Events</h2>
    <ol>
        <%events.forEach(function(event){%>
            <li><p><%= event %></p></li>
        <%});%>
    </ol>
    <div id="googleMap" style="width:650px;height:700px;"></div>`
</body> 
</html>`

和map_head.ejs

<script src="http://maps.googleapis.com/maps/api/js"></script>
<script>
    function initialize() {
        var mapProp = {
            center:new google.maps.LatLng(10, 90),
            zoom:4,
            mapTypeId:google.maps.MapTypeId.ROADMAP
        };
        var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);
        events.forEach(function (event) {
            var marker = new google.maps.Marker({
                position: new google.maps.LatLng(Number(event.latitude), Number(event.longitude)),
                map: map,
                title: "test"
            });
        });
    }
    google.maps.event.addDomListener(window, 'load', initialize);
</script>

1 个答案:

答案 0 :(得分:1)

事件对象仅为服务器及其ejs解析器所知。

客户端未在您提供的代码中收到事件对象。 它只收到一个&#34; ol&#34;列表。

您可以在map_head.ejs中包含events对象,代码如下:

var events=<%- JSON.stringify(events); %>;