我是 node.js 的新手，正在尝试在页面上放置一个简单的 OpenLayers map 。但是， map 没有显示。
代码:
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>
知道我做错了什么吗？
最佳答案
第一个问题是 view.jade 中的 Javascript block 没有缩进。 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")
关于javascript - 在 Node.js View 中创建 OpenLayers map ，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/36632467/