我是新来的node.js，并试图在页面上放置一个简单的OpenLayers地图。但是，地图没有显示出来。在Node.js视图中创建OpenLayers地图

代码：

app.js

var express = require('express'); 
var app = express(); 

app.set('view engine', 'jade'); 
app.use(express.static(__dirname + '/public')); 


app.get('/', function(req, res){ 
    res.render('index', {title: 'Map Viewer'}); 
}); 

app.get('/map', function(req, res){ 
    res.render('view'); 
}); 

app.listen(3000, function(){ 
    console.log('Server listening on port 3000...'); 
});

layout.jade

doctype html 
html 
    head 
    title= title 
    link(rel='stylesheet', href='/stylesheets/style.css') 

    body 
     block content

view.jade

extends layout 
block content 
    #map 


script(type='text/javascript'). 

var map = new ol.Map({ 
    target: 'map', 
    layers: [ 
     new ol.layer.Tile({ 
     title: 'Global Imagery', 
     source: new ol.source.TileWMS({ 
      url: 'http://demo.opengeo.org/geoserver/wms', 
      params: {LAYERS: 'nasa:bluemarble', VERSION: '1.1.1'} 
     }) 
     }) 
    ], 
    view: new ol.View({ 
     projection: 'EPSG:4326', 
     center: [0, 0], 
     zoom: 0, 
     maxResolution: 0.703125 
    }) 
    });

在package.json我使用"openlayers": "^3.15.1"

结果：

上面的代码产生一个空白页面，下面的HTML：

<html> 
    <head> 
    </head> 
    <title> 
    </title> 
    <link rel="stylesheet" href="/stylesheets/style.css"> 
    <body> 
     <div id="map"> 
     </div> 
    </body> 
</html>

任何想法wh在我做错了？

来源

2016-04-14 Sara Tibbetts

第一个问题是，在view.jade JavaScript块没有缩进。包括script(type='text/javascript').在内的所有内容都需要缩进一个空格。

另一个问题是ol.js未被导入。在layout.jade必须添加以下行：

script(type='text/javascript' src="https://cdnjs.cloudflare.com/ajax/libs/ol3/3.15.1/ol.js")

来源

2016-04-15 12:34:37

在Node.js视图中创建OpenLayers地图

代码：

结果：

回答

相关问题