Javascript 从MongoDB在OSM上绘制点_Javascript_Angularjs_Node.js_Mongodb_Template Engine

Javascript 从MongoDB在OSM上绘制点

javascript angularjs node.js mongodb

Javascript 从MongoDB在OSM上绘制点,javascript,angularjs,node.js,mongodb,template-engine,Javascript,Angularjs,Node.js,Mongodb,Template Engine,mongodb中“shows”集合的数据库“video”中存储的数据如下所示。它有3个参数作为剂量率，x，y 我的“app.js”代码如下： var express=require('express'); var MongoClient=require('mongodb').MongoClient; var engines=require('consolidate'); var assert=require('assert'); var app=express(); app.engine('h

mongodb中“shows”集合的数据库“video”中存储的数据如下所示。它有3个参数作为剂量率，x，y

我的“app.js”代码如下：

var express=require('express');
var MongoClient=require('mongodb').MongoClient;
var engines=require('consolidate');
var assert=require('assert');
var app=express();

app.engine('html',engines.nunjucks);
app.set('view engine','html');
app.set('views',__dirname+ '/views');

MongoClient.connect('mongodb://localhost:27017/video',function(err,db){
assert.equal(null,err);
console.log("successfully connect to the MongoDB server");
app.get('/',function(req,res){
    db.collection('shows').find({}).toArray(function(err,docs){
        res.render('shows',{'shows':docs});
        });
      });
    });
 });

app.listen(4596,function(req,res){
console.log("connect to the port 4596");
});

下面的代码用于“shows.html”：


标绘点

{在shows%%中显示的百分比}
{{显示剂量率}
{{show.x}
{{show.y}
{%endfor%}

在本地主机上运行“app.js”代码并从浏览器打开“shows.html”时，输出是“视频”数据库中我的“shows”集合的所有点（即剂量率，x，y）在html页面上显示为

现在我有了在OSM上独立绘制单点（77.5,18.1025）的代码，如下所示：

<!DOCTYPE HTML>
<html> 
<head>
<title>OpenLayers Simplest Example</title>
</head>
<body>
<div id="Map" style="height:600px"></div>
<script src="/home/padmesh/mean/osm sample/OpenLayers.js"></script>
<script>
var lat            = 77.5;
var lon            = 18.1025;
var zoom           = 10;

var fromProjection = new OpenLayers.Projection("EPSG:4326"); //Transform from WGS 1984
var toProjection   = new OpenLayers.Projection("EPSG:900913"); //to Spherical Mercator Projection
var position       = new OpenLayers.LonLat(lat,lon).transform( fromProjection, toProjection);

map = new OpenLayers.Map("Map");
var mapnik         = new OpenLayers.Layer.OSM();
map.addLayer(mapnik);

var markers = new OpenLayers.Layer.Markers( "Markers" );
map.addLayer(markers);
markers.addMarker(new OpenLayers.Marker(position));

map.setCenter(position, zoom);

</script>
</body>
</html>


OpenLayers是最简单的例子
var lat=77.5；
var-lon=18.1025；
var=10；
var fromProjection=新OpenLayers.Projection（“EPSG:4326”）//从WGS 1984转换而来
var TopProjection=新OpenLayers.投影（“EPSG:900913”）//球面墨卡托投影
var position=新OpenLayers.LonLat（lat，lon）.transform（fromProjection，toProjection）；
map=新的OpenLayers.map（“map”）；
var mapnik=new OpenLayers.Layer.OSM（）；
map.addLayer（mapnik）；
var markers=新的OpenLayers.Layer.markers（“markers”）；
添加图层（标记）；
markers.addMarker（新OpenLayers.Marker（位置））；
地图设置中心（位置、缩放）；

我想将存储在我的集合中的所有点“显示”从OSM地图上的数据库中一个接一个地绘制为“x”和“y”。我试图找到所有关于这个问题的参考资料，但没有找到。请帮助我这样做，因为我是OSM和nodejs的新手，或者发布任何我可以阅读的参考资料，或者标记可以帮助的人。提前谢谢

“它不起作用”并不是很具体。。。添加代码并提供更多详细信息以了解问题。因为现在您的问题太宽泛、不清楚、离题，因为您正在请求调试帮助，但没有代码、错误消息详细信息。有关详细信息，请参阅。@geisterfurz007以获取答复。为了更好地理解，我编辑了我的问题。如果需要任何其他更改，请建议我。@KevinAdistambha也感谢您的回复。请标记任何可以帮助我解决此问题的相关人员。如果我理解正确，您希望使用OpenStreetMap显示数据库的内容。因为这是一个特定的OpenStreetMap用例，所以我建议改为询问。另外，MongoDB+express代码似乎工作正常。

<!DOCTYPE HTML>
<html> 
<head>
<title>OpenLayers Simplest Example</title>
</head>
<body>
<div id="Map" style="height:600px"></div>
<script src="/home/padmesh/mean/osm sample/OpenLayers.js"></script>
<script>
var lat            = 77.5;
var lon            = 18.1025;
var zoom           = 10;

var fromProjection = new OpenLayers.Projection("EPSG:4326"); //Transform from WGS 1984
var toProjection   = new OpenLayers.Projection("EPSG:900913"); //to Spherical Mercator Projection
var position       = new OpenLayers.LonLat(lat,lon).transform( fromProjection, toProjection);

map = new OpenLayers.Map("Map");
var mapnik         = new OpenLayers.Layer.OSM();
map.addLayer(mapnik);

var markers = new OpenLayers.Layer.Markers( "Markers" );
map.addLayer(markers);
markers.addMarker(new OpenLayers.Marker(position));

map.setCenter(position, zoom);

</script>
</body>
</html>