【发布时间】:2016-12-30 10:18:18
【问题描述】:
我对 OpenLayers 和 JavaScript 非常陌生,我遇到了以下问题。
我有一个.csv 表,表示我想使用 OpenLayers 在地图上将它们可视化的点的坐标。
我在 OpenLayers 页面上找到了以下示例,
https://openlayers.org/en/latest/examples/polygon-styles.html
但是,我无法理解那里的坐标表示。更具体地说,例如,我不知道坐标 [-5e6, 6e6] 中的 e 是什么意思。
但是,我尝试使用我的坐标在我的地图上绘制一个简单的正方形,但它只是给了我一个位于地图中心的点,如下所示:
https://jsfiddle.net/api/post/library/pure/#&togetherjs=bD5bfPm7vz
所以我不知道到底出了什么问题,我应该改变什么?我认为这完全是坐标的书写方式,但不确定。
这是我的代码:
var styles = [
new ol.style.Style({
stroke: new ol.style.Stroke({
color: 'blue',
width: 3
}),
fill: new ol.style.Fill({
color: 'rgba(0, 0, 255, 0.1)'
})
}),
new ol.style.Style({
image: new ol.style.Circle({
radius: 5,
fill: new ol.style.Fill({
color: 'orange'
})
}),
geometry: function(feature) {
// return the coordinates of the first ring of the polygon
var coordinates = feature.getGeometry().getCoordinates()[0];
return new ol.geom.MultiPoint(coordinates);
}
})
];
var geojsonObject = {
'type': 'FeatureCollection',
'crs': {
'type': 'name',
'properties': {
'name': 'EPSG:3857'
}
},
'features': [{
'type': 'Feature',
'geometry': {
'type': 'Polygon',
'coordinates': [[[-5e6, 6e6], [-5e6, 8e6], [-3e6, 8e6],
[-3e6, 6e6], [-5e6, 6e6]]]
}
}]
};
var source = new ol.source.Vector({
features: (new ol.format.GeoJSON()).readFeatures(geojsonObject)
});
var layer = new ol.layer.Vector({
source: source,
style: styles
});
var basic = new ol.layer.Tile({
source: new ol.source.OSM()
});
var map = new ol.Map({
layers: [basic, layer],
target: 'map',
view: new ol.View({
center: [0, 3000000],
zoom: 2
})
});
【问题讨论】:
标签: coordinates polygon openlayers-3