标签: openlayers

如何在OpenLayers-Map中删除标准控件?

我使用OpenLayers并希望在左上角创建另一个导航控件.我知道如何添加控件,但在创建OpenLayers-Map时默认添加此导航.所以我想删除该控件,添加一个自己的.我已经知道,默认控件是一个OpenLayers.Control.PanZoom.

javascript openlayers

11
推荐指数
2
解决办法
2万
查看次数

升级到Google地图版本3,还是转到OpenLayers?

我负责管理一些用于创作地理数据集的学术网络地图软件的开发.这是一个用于创建历史地图的相当简单的界面.该项目基于谷歌地图v.2,并且因为v.2将在2013年停止,我们认为我们会提前咬紧并升级到第3版.

事实证明,这是一项重要的工作,需要完全重新思考我们的应用程序的地图部分是如何工作的.我们必须重写所有自定义Gmap控件,重组应用程序的几个部分以及一些其他重大更改 - 例如,v.3不与Google Earth以及v.2集成,我们使用Google Earth很多.正因为如此,并且因为我们开始使用Gmap本身不支持的更多功能(如WMS地图),我一直想知道是否值得从Gmap切换到OpenLayers.据我所知,OpenLayers拥有Google Maps的所有功能,对WMS提供原生支持并支持更多数据格式,让我们无论如何都可以使用所有Google图像,并与KML配合使用.

我对社区的问题是对于了解OpenLayers和Google Maps的人:您能否让我了解从Gmap v.2升级到v.3的工作负载与从Gmap v.2到OpenLayers的完整端口的比较?我们应该注意哪些其他缺点?

我们最担心的问题之一是:我们经常使用Google地球.如果我们去OpenLayers,我们必须自己同步Earth和OpenLayers,但听起来这就是我们在Gmap v.3中必须做的事情.据我所知,OpenLayers没有对Google Earth或任何类型的3D geobrowser的原生支持,但有一些项目(如此)试图缩小差距.这会引起多大的麻烦?

google-maps openlayers

11
推荐指数
1
解决办法
1623
查看次数

Openlayers:矢量特征而不是标记

我想在地图上放置一个符号.例如

地图示例

到目前为止,我已经使用OpenLayers OpenLayers.Layer.Markers.代码如下所示:

    map = new OpenLayers.Map('map');
    layer = new OpenLayers.Layer.OSM( "Simple OSM Map");
    map.addLayer(layer);
    map.setCenter(
        new OpenLayers.LonLat({{ location.lon }}, {{ location.lat }}).transform(
            new OpenLayers.Projection("EPSG:4326"),
            map.getProjectionObject()
        ), 15);

   var lonLat = new OpenLayers.LonLat({{ location.lon }}, {{ location.lat }})
             .transform(
               new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984
               map.getProjectionObject() // to Spherical Mercator Projection
             );
   var markers = new OpenLayers.Layer.Markers( "Markers" );
   map.addLayer(markers);
   markers.addMarker(new OpenLayers.Marker(lonLat));
Run Code Online (Sandbox Code Playgroud)

这可以作为例外,并显示上面的地图.但我无法使用Vector替换最后3行:

     vectors = new OpenLayers.Layer.Vector("Vector Layer");
     vectors.addFeatures([new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(lonLat))]);
     map.addLayer(vectors);
Run Code Online (Sandbox Code Playgroud)

是否需要使用特殊魔法OpenLayers.Feature.Vector

openlayers

11
推荐指数
1
解决办法
2万
查看次数

有没有办法在OpenLayers 3中禁用旋转?

我目前正将OpenLayers 2 Mapview升级到OpenLayers 3.我非常喜欢新的OpenLayers客户端,但我想停用在移动设备上旋转地图的功能(用2个手指旋转).

但我找不到任何设置.这是不可能的,还是我只是愚蠢地找到设置?

我正在使用openlayers javascript客户端的当前发行版本(3.0.0).(https://github.com/openlayers/ol3/releases/tag/v3.0.0)

javascript openlayers openlayers-3

11
推荐指数
2
解决办法
7427
查看次数

在Redux架构中集成React和OpenLayers

我们目前正在为我们公司开发一个新的网络地图解决方案.到目前为止,我们决定使用React和构建应用程序OpenLayers 4.由于我们希望将Redux模式用于我们的体系结构,因此将有一个redux存储保存应用程序状态.

我们在这个堆栈中遇到的问题如下:
map是我们应用程序中的中心元素,它的实例需要传递给许多不同的组件.例如,用于在地图上绘制要素的工具需要对map实例的引用,以便它可以将其自身添加为交互工具.
我们讨论了如何构建我们的应用程序以最可靠的方式集成OpenLayers,React最终得到两种不同的方法:

  1. 我们讨论的第一种方法是在应用程序范围的redux存储中保存对map对象的引用,这样它就可以通过@connect注释函数传递给任何组件react-redux.虽然这个解决方案提供了一个简单的访问,map我们想知道这是否是一个易处理的方法,因为存储应保持最小,并且map对象永远不会在应用程序的整个生命周期中发生变化.

  2. 第二种方法将渲染组件(如上面提到的绘制交互)视为反应图组件的子组件.map然后,可以直接将实例作为a prop或通过利用模式利用反应context对象传递给地图组件的子项Provider.
    但是,反应文档明确建议不要使用context,尽管我们发现了许多使用这种模式的解决方案(react-geo,react-leaflet)以及流行的库,比如react-redux使用它.
    因此,我们考虑使用React.Children.map()克隆子组件,然后将map其添加为prop.

我希望我们面临的问题足够清楚.我们不知道在react最佳实践方面哪种方式更好.

什么架构更适合设计/管理和应用的"反应方式"?为什么?

javascript openlayers reactjs redux react-redux

11
推荐指数
1
解决办法
563
查看次数

多层的Openlayers和事件(OpenLayer.Layer.Vector)

另一天与openlayers和另一个问题一起工作.

即 - 我有多个矢量图层在彼此的顶部,用于不同类型的东西(汽车,历史和地区的旅行).他们都有我试图抓住的事件......但是正如尼克拉斯发现的那样,当你在一个层上激活事件时,它会被移动到顶层并且下面层上的事件不会被触发.

有没有办法绕过这个?因为当我移动区域多边形时,我希望事件触发并显示其名称,当我将鼠标移动到汽车标记时,我也希望事件发生火灾.并且不 - 我不想将它们放在同一层上,因为我希望它能够快速关闭或打开它们而不需要循环遍历所有功能并且每个功能都禁用它们.

艾伦

Edit1:我做了一些搜索,发现你可以在多个图层上使用相同的控件.这可能对我来说可以解决这个问题.我正在检查它并测试是否向单个控件添加更多层是我的问题的解决方案.

events openlayers

10
推荐指数
1
解决办法
2万
查看次数

如何将地图的当前视口作为几何,边界框或wkt从OpenLayers中获取?

我试图找到一些提示,我应该搜索这个主题,但我找不到任何东西 - 我花了很多时间在这上面.

我还试图从OpenLayers地图中获取当前显示的视口中的当前坐标,以仅添加当前视口的当前边界框中的这些矢量.

javascript latitude-longitude openlayers

10
推荐指数
2
解决办法
2万
查看次数

更新到OpenLayers 3

我想将我的应用程序从OpenLayers 2更新到OpenLayers 3.

是否有人知道有助于此的迁移指南(或类似的东西)?

openlayers openlayers-3

10
推荐指数
2
解决办法
6461
查看次数

获取坐标事件地图 openlayers 4.6.5 ~ 5

我尝试获取在 openlayers 地图上单击的坐标。我的代码如下:

const localmap = new ol.Map({
    layers: [
      new ol.layer.Tile({
        source: new ol.source.OSM()
      })
    ],
    target: 'map',
    view: new ol.View({
      center: [0, 0],
      zoom: 2
    })
  });

  function getPosition(event){
    console.log(localmap.getEventCoordinate(event));
}

  localmap.on('click', getPosition(event));
Run Code Online (Sandbox Code Playgroud)

但我以这种方式唯一得到的是一个错误:

Uncaught TypeError: Cannot read property 'changedTouches' of undefined
Run Code Online (Sandbox Code Playgroud)

我尝试将侦听器添加为

localmap.on('click', getPosition);
Run Code Online (Sandbox Code Playgroud)

它在每次点击时显示一个数组,但它填充了 Nan 值。

我试过 seraching doc 和所有但它太旧或直接在监听器中编写函数,我不想要因为我希望能够删除它

有人知道如何在 ol 4.6.5 ~ 5 中获得这些坐标吗?

谢谢

javascript openlayers

10
推荐指数
2
解决办法
7087
查看次数

Chromium WebView 上有关高负载导致画布上部分渲染的错误的解决方法

我在 Chrome 最新的 WebView 上发现了[1]这个问题。要生产它,您需要三件事:

  1. 您已将 WebView 更新至 2021 年 11 月 15 日版本
  2. AndroidManifest 中的 HardwareAcceleration 设置为 true
  3. 当你大量地为 webview 渲染内容时,你开始在屏幕上看到丢失的内容。

我的技术堆栈在应用程序内部使用 Openlayers 地图,该地图实际上是一个包含 Cordova 的小型网站,Cordova 是使用 WebView 的组件。

我所说的大量使用是指地图必须具有多层地图数据才能渲染,并且我必须采取一些措施来移动地图并使其在前一个渲染内容完成之前开始加载下一个渲染内容。

安装后第一次打开地图时,地图在重负载下工作正常。当我终止应用程序并再次登录并在应用程序第一次尝试渲染时做出剧烈动作时,问题就开始了。之后,地图不会整体呈现内容,某些图块和地图菜单仅部分呈现。

即使我单击一些地图图层,这种行为仍然会继续,并且当它们很少时,问题就会解决。有趣的是,没有一个点的负载足以触发问题或稳定下来,至少每个方向的点是不同的。

仅当存在问题时,logcat 才会出现一条警告消息:

chromium: [错误:tile_manager.cc(821)] 警告:超出图块内存限制,某些内容可能无法绘制

我可以观察到,2021 年 11 月 15 日版本更新删除了一些“无用数据” [2]。我不能 100% 确定这两件事是否相关,但我已经意识到该特定更新之前的版本在我的应用程序中工作得很好(我从 Google Play 中的 WebView 中删除了更新)。

目前有三种解决方法:

  1. 不要使用太重的地图图层并触发问题(通过向用户隐藏关键信息而损害我们的应用程序用户体验)
  2. 从 PlayStore 中删除 webview 更新(我亲自测试过,系统一夜之间将损坏的版本更新回来,很难与最终用户沟通)。
  3. 不使用硬件加速。(应用程序的其他部分变得毫无用处,太慢的行为会让最终用户生气)。

正如您所观察到的,这些都效果不佳。我相信其他 WebView 重度用户也会看到同样的行为,所以我只用一个主要问题来打开这个问题:

与此同时,我的错误报告正在 Google 中推进,我可以做些什么来克服这个问题?


资料来源:

[1] https://bugs.chromium.org/p/chromium/issues/detail?id=1274482

[2] https://chromium.googlesource.com/chromium/src/+/a0994781ea666d9b630b6478206ac429ed8444d1%5E%21/#F0

javascript android webview openlayers cordova

10
推荐指数
0
解决办法
786
查看次数