标签: openlayers
使用离线 OSM 的离线 OpenLayers Web 应用程序
我正在尝试创建基于地图的 Web 应用程序，用户可以在提供的地图上设置地标。地图的边界仅限于一个小城市，并且客户端计算机始终处于离线状态，根本无法访问互联网。经过一整天的谷歌搜索，我发现OpenLayers和OpenStreetMap 的组合是一个不错的选择。
以下示例由OpenLayers网站提供：
<!doctype html>
<html lang="en">
<head>
<link rel="stylesheet" href="http://openlayers.org/en/v3.0.0/css/ol.css" type="text/css">
<style>
.map {
height: 400px;
width: 100%;
}
</style>
<script src="http://openlayers.org/en/v3.0.0/build/ol.js" type="text/javascript"></script>
<title>OpenLayers 3 example</title>
</head>
<body>
<h2>My Map</h2>
<div id="map" class="map"></div>
<script type="text/javascript">
var map = new ol.Map({
target: 'map',
layers: [
new ol.layer.Tile({
source: new ol.source.MapQuest({layer: 'sat'})
})
],
view: new ol.View({
center: ol.proj.transform([37.41, 8.82], 'EPSG:4326', 'EPSG:3857'),
zoom: 4
})
});
</script>
</body>
</html>
这工作正常，但需要一台连接互联网的计算机。几个谷歌搜索小时后，我发现了另一个网站，提供离线OpenStreetMap的 …
推荐指数
解决办法
查看次数
如何使用 cql 过滤器过滤 geoserver 图层组
我正在尝试将 cql 过滤器与 geoserver 图层组一起使用。仅使用层我就可以使用CQL_FILTER实现过滤。这是 geoserver 的测试页并显示属性。
。![geoserver] 没有图层组，我的意思是如果我只使用图层。下面的代码可以过滤wms图层。
STATUS=4。
那么如何使用 cql_filters 过滤图层组。
推荐指数
解决办法
查看次数
在 OpenLayer 中更平滑地加载图块
我想改善使用 OpenLayer 显示的地图的加载体验。目前，新图块的加载不是很顺利，尤其是在地图的空白区域加载图块时。我想为新图块的出现设置动画，例如通过调整要显示的新图像的不透明度。我有一种感觉，这就是传单正在做的事情。
问题是我没有找到一种方法来监听图块准备好显示的情况，更不用说如何在之后为其设置动画了。
解决这个问题的最佳方法是什么？也许我正朝着错误的方向前进。
推荐指数
解决办法
查看次数
Openlayers 4 - 在功能点击时使图层不可见
我有2地图layer的含features（标记）。我已经这样做了，如果地图放大到足够远，1layer将变得不可见，另一个将变得可见（反之亦然）。像这样：
this.map.getView().on('propertychange', (e: any) => {
if (e.key == "resolution") {
if (this.map.getView().getZoom() >= 17) {
exampleLayer1.setVisible (false);
exampleLayer2.setVisible (true);
} else if(this.map.getView().getZoom() < 17) {
exampleLayer2.setVisible (false);
exampleLayer1.setVisible (true);
}
}
})
我现在需要补充的是，如果你点击一个feature在exampleLayer1层，地图会在和中心开始放大对要素的位置，这将使exampleLayer1消失，exampleLayer2可见。为此，我使用此功能：
var select_interaction = new ol.interaction.Select();
select_interaction.getFeatures().on("add", (e: any) => {
var feature = e.element;
this.map.getView().setCenter(feature.getGeometry().getCoordinates())
this.map.getView().setZoom(17);
});
this.map.addInteraction(select_interaction);
几乎一切正常，这意味着一个layer会消失，另一个会出现。但是，feature点击不会消失，即使它的父级 (the layer) 确实消失了。如果我然后点击feature它就会消失。
我怎样才能让它layer（包括 …
推荐指数
解决办法
查看次数
OpenLayers 4.6.5 中心不起作用
中心不工作
https://jsfiddle.net/YuK1Game/katcr16L/8/
let olView = new ol.View({
center: [35.689634, 139.692101],
zoom: 4,
});
中心 35.689634, 139.692101 是日本的东京。但是，它不起作用谢谢
推荐指数
解决办法
查看次数
OpenLayers 4 城市坐标中心地图
我在将地图集中在创建上时遇到问题。
我的 javascript 代码来自快速入门指南，html 代码也是如此。
var map = new ol.Map({
target: 'map',
layers: [
new ol.layer.Tile({
source: new ol.source.OSM()
})
],
view: new ol.View({
center: ol.proj.transform([51.35847, 7.49918], 'EPSG:4326', 'EPSG:3857'),
zoom: 4
})
});
它只是不会居中，我不明白为什么？我完全按照 stackoverflow 上其他问题和主题中的描述进行操作......
小提琴： https: //jsfiddle.net/gpo33ga6/
推荐指数
解决办法
查看次数
OpenLayers v 5.3.0 - 找回归因行为
在新版本 v 5.3.0（ol 地图库）中更改了行为归因。在我有图标“i”之前，在它下面显示图层的所有属性。
现在我有一些扁平化的信息。
开发者给出了使用之前行为的说明：
归因不可折叠
ol/source/OSM当地图包含来自
ol/source/OSM源的图层时，ol/control/Attribution控件将显示为“可折叠：假”行为。要获得以前的行为，请
ol/control/Attribution使用collapsible: true.
但如何实现这一目标？
推荐指数
解决办法
查看次数
如何删除 OpenLayers 5 中的绘图？
I am using OpenLayers to create a map that allows a user to draw on it. The drawing options are implemented from the official docs and do work. https://openlayers.org/en/latest/examples/draw-features.html
I tried to give the user an option to delete his former drawing. By holding the key "A" you can see the users selection. Now this selected drawings should be deleted in the moment the key is released (but nothing happened).
var select = new Select();
window.addEventListener('keydown', function (event) {
// …推荐指数
解决办法
查看次数
如何在openlayers中从数组的连续点绘制线串
我试图LineString在 openlayers 中连续绘制，Points以赋予它一种动画的感觉，就像它从头到尾绘制一样。
我试图通过遵循这个例子来实现它 。OL2 的所有引用都转换为 OpenLayers 5，但仍然应该绘制一个点，然后是整个数组的下一个，而不是一次。
推荐指数
解决办法
查看次数
通过地图缩放更改图标大小
我正在使用一个 20x20 像素的图标显示在地图上，代码如下：
当我缩放地图时，图标看起来很小，如何通过地图缩放更改图标大小？
<link rel="stylesheet" href="https://openlayers.org/en/v4.6.5/css/ol.css" type="text/css">
<script src="https://openlayers.org/en/v4.6.5/build/ol.js" type="text/javascript"></script>
<script>
var baseMapLayer = new ol.layer.Tile({
source: new ol.source.OSM()
});
var view = new ol.View({
center: ol.proj.fromLonLat([-74.0061,40.712]),
zoom: 17 //Initial Zoom Level
})
var map = new ol.Map({
target: 'map',
layers: [ baseMapLayer],
view: view
});
// Make a new feature marker
var marker = new ol.Feature({
name: 'Null Island',
population: 4000,
rainfall: 500,
geometry: new ol.geom.Point(
ol.proj.fromLonLat([-74.006,40.7127]) // new Point([0, 0])
), // Cordinates of New York's Town …推荐指数
解决办法
查看次数
标签 统计
openlayers ×10
javascript ×6
openlayers-5 ×3
openlayers-3 ×2
asp.net ×1
center ×1
drawing ×1
geoserver ×1
gis ×1
node.js ×1
offlineapps ×1
typescript ×1