有时,当我将地图(相同的html、css、js)添加到不同的页面时,地图会变得模糊。不同的页面可能包含其他html、css和js。左侧的清晰图片位于添加了第三方CSS的页面内。右边的一个没有其他人的html、css和js
如何解决此问题
在检查它们的细节时,我注意到第二个示例的画布尺寸要小得多
编辑[已修复!]:
我在查看ol.js源代码时发现了问题。在console上,模糊图像的map.frameState_uxAE.pixelRatio=0.89(默认为window.devicePix
假设我在一张地图上有两组具有不同属性的功能:功能a和功能B。我为这两种功能类型设置了一个交互,因为
如果我选择一个A特征,然后选择一个B特征,则A特征将从featureCollection中删除。如何同时选择这两个选项?我还希望每种类型最多选择一个功能
示例用例:
Click on A1 --> add A1
Click on A2 --> remove A1 and add A2
Click on B1 --> add B1
Click elsewhere on map --
我有两种交互样式,一种高亮显示功能,另一种放置带有功能名称的工具提示。评论这两个版本时,它们都非常快,不管是哪一个版本,IE和Firefox中的地图应用程序都会变慢,但Chrome不会
map.addInteraction(new ol.interaction.Select({
condition: ol.events.condition.pointerMove,
layers: [stationLayer],
style: null // this is actuall
如何在Openlayers 3中将集群层的样式定义为ol.style.style对象,而不是函数
我正在使用一个库(ol3谷歌地图),它只接受ol.style.style对象进行样式设置。使用样式功能将每个集群中的功能数量动态添加到其图标:
style: function(feature, resolution) {
console.log(feature);
var size = feature.get('features').length;
var style = styleCa
我是OpenLayers3的新手,尝试构建一个简单的表单,将我的地图集中到一个给定的位置。问题是我总是在靠近南极的地方着陆。这是我的密码:
var map = new ol.Map({
target: 'map',
layers: [
new ol.layer.Tile({
source: new ol.source.OSM
})
],
view: new ol.View({
center: [0,0],
我已经用ol3创建了一张地图,并添加了ol.animation来从一个城市“飞”到另一个城市。单击“开始”按钮后,动画应在几秒钟内开始。所以,它应该是这样工作的:
地图以一个叫做“Eifel”的点为中心
单击开始按钮
三秒钟后,飞往“柏林”的航班开始(需要2秒钟)
在柏林停留1秒钟,然后飞往“斯图加特”
下面的代码几乎可以工作,但它直接切换到“斯图加特”。我认为问题在于最后的“map.getView().setCenter(斯图加特);”。我怎样才能使它按预期工作
// Klick au
我已经开始在我的应用程序中使用OpenLayers3,到目前为止,我已经成功创建了以下的工作版本:
组合绘制/修改页面(基于相关示例,draw and modify features.js)
组合选择/修改页面(基于相关示例,modifyfeatures.js)
在(1)的情况下,ol.interaction.Modify实例指定它将在ol.FeatureOverlay实例内的功能上工作:
var modify = new ol.interaction.Modify({
features
在ol.control.ZoomToExtent中,Openlayers3使用“E”字符作为视图()。
但是我想添加图像。如何执行此操作?设置控件时,可以向其传递多个选项,其中一个选项是标签
将标签设置为“”,并将类名设置为特定样式,在CSS中设置元素的样式,根据需要添加图像。向我们展示您目前拥有的内容。您能给我发送示例吗?请查看。它使按钮成为一个图像。没问题。如果这对你有效,不要忘记将问题标记为已回答,这样其他人就可以找到解决方案。好运气请检查下一个问题:
我想做的是显示被某人覆盖的区域。例如,一个搜索小组穿过一块田地,一个人可以看到大约50米左右的东西。所以我想显示一个宽度为100米的多边形,以及已经走过的路径的长度。我需要以图形方式和面积测量方式显示这一点
我实现这一点的最佳方法是创建一条线串,然后通过某种方式将点a的线与点B的线成90度角来创建一个多边形。类似于:
| |
| |
Point A +-----------------+ Poi
我有一个弹出窗口,当你点击地图标记时弹出。在弹出窗口中有一个小地图,显示单击但放大的点,因此地面上该点的缩略图。此小地图是弹出窗口中的innerHTML元素。当我第一次单击标记时,此地图元素为空,但当我调整浏览器窗口的大小时,会显示地图。另外,当我点击另一个标记时,如果我不关闭弹出窗口,地图就会出现。当弹出窗口最初出现时,地图不会显示,除非我调整浏览器的大小。有人知道可能是什么问题吗?谢谢 我以前遇到过这个问题-在调整窗口大小时。我倾向于在启动时触发调整大小以强制它
尝试调用map.getMap
目前,openlayers3中的overviewmap控件就像一个小地图,您可以在主地图上看到正在执行的操作
是否有人尝试过或知道是否可以双向使用概览图?这意味着您可以从概览图中选择红色矩形,并在概览图中移动它,主地图视图将使用概览图中的操作进行更新。目前不可能这样做,但OL3 GitHub中对此进行了公开讨论:
欢迎捐款
使用OL3,我在样式上动态设置文本:
var myLayer = new ol.layer.Vector({
source: mySource,
style: function (feature, resolution) {
var style = new ol.style.Style({
text: new ol.style.Text({
是否仍要指定支持多个投影的(平铺)WMS源
例如,我的WMS服务器支持对EPSG:4326和EPSG:3395的请求。因此,如果服务器端支持投影,则会使用适当的投影请求平铺,否则OpenLayers会尝试重新投影其中一个受支持的投影。您可以使用客户端重新投影来执行此操作,请参见此
只需将projection属性添加到ol.source.TileWms这里的要点是在可用时利用服务器端的投影。最终在运行时交换源。您可以使用WMS GetCapabilities在WMS中获得可用的投影。我事先知道哪些
我们将在移动设备上的webview中显示地图(带有自定义瓷砖覆盖),当没有连接时,我们必须支持从设备加载地图的低分辨率版本(带有自定义瓷砖覆盖)。而开放层2也有一些例子。我们找不到任何具有开放层3的。我们希望更多地了解这方面的情况,因此采取任何替代解决方案都为时不晚 这方面已经有很多线程了,只需使用自定义tileLoadFunction即可。请参阅,例如,已经有许多线程在这方面,只需使用自定义tileLoadFunction。见例。
我在桌面应用程序中嵌入了OpenLayers,我正试图从需要身份验证的服务器请求WMS映射层
由于环境的原因,我不能使用浏览器通常显示的弹出窗口来要求身份验证,而且客户无论如何也不会接受
现在我想使用https://{username}:{password}@domain.com/wms的格式
如果我将其作为ol.source.TileWMS的url传递给OpenLayers,则请求中的用户名和密码将被删除,并且我始终会看到401个错误返回,查看url时,用户名和密码已被删除。您可以尝试使用
编
我有本地地图分幅,还有几何图形。(GeoJson从geoserver获取)。现在我想从GeoJson文件创建utfgrid。
我一直在寻找一些可以帮助我的库,但我找不到好的库。如果您使用的是最新版本(2.9+)的GeoServer,您可以使用format=application/json;type=utfgrid。检查您的getCapabilities响应以查看它是否可用
有关如何使用输出的更全面讨论,请参阅此部分。@HemalGondaliya如果答案对您有效,您可以接受答案,将问题标记为已解
我正在尝试为我的地图设置动画,但我在做这件事时遇到了问题。我看过openlayers 3的例子,但是我不得不改变一些东西来适应我的网络,现在它不起作用了。这是我的代码:
var name_button_see_pozo = ".verpozo"; // Class
$(document).on('ready',function(){
$(name_button_see_pozo).on('click',function(e){
e.preventDefault();
我想对ol3(ol.format.WFS2和ol.format.CityGML)进行一些更改,以查询返回CityGML的WFS2.0
但是,我找不到如何将openlayers源文件包含到我的开发应用程序中
目前我使用“make build”并包含ol-debug.js,但这对于开发来说相当麻烦。在bartvde的帮助下,在评论中:
跑
在ol3文件夹中
这将在localhost:3000上设置一个服务器,其中包含一个loader.js文件,您可以在演示开发网站中引用(),以便加载所有源代码。您看
我正在本地加载一个KML文件,我已经能够成功地将其添加到地图中。但是,我想在功能上进行交互,似乎无法使任何功能正常工作。我的代码当前为:
var myLayer = new ol.layer.Vector({
source: new ol.source.Vector({
url: '/kml/sample.kml',
format: new ol.format.KML()
})
});
// Iterate over features *NOT
我正在尝试使用OpenLayers3和OSM底图(EPSG:3857)发出WMS请求。
geoserver上的光栅数据位于EPSG:32629上
不知怎的(?!)直到最近,我的设置还不错。
即使使用不同的投影,光栅图像也能正确地显示在地图上
更新到2.15.2之后,将不再显示“我的图层”。
我把这个问题追溯到了一个重投影问题,但没有完全弄清楚
我的要求基本上是:
var untiled=new ol.layer.Image({
来源:新ol.source.ImageWMS({
比率:1,
网址
我正试图通过websocket向OpenLayers3地图添加新功能。
Websocket正在获取数据,我可以在控制台日志中看到它,但在第一次之后它从未显示在地图上
我感到困惑的是,为什么第一个功能可以工作,而其余功能都失败了
这是密码
function positioningUpdate() {
var host = 'ws://127.0.0.1:9000/websocket/';
websocket = new WebSocket(host);
我试图找出一种方法,将高级填充样式应用于OpenLayers-3中的多边形。我想找到一种方法,用OL3重现以下风格:
OL2解决方案使用SLD格式,而OL3中似乎没有实现这种格式
我在《无限地理》上找到了一篇很棒的文章,讨论了ol.style.style的几何选项,该选项允许提供高级样式。此选项非常好,但使用此技术对多边形应用哈希模式将严重影响性能
有什么建议吗?
谢谢 这还不受支持,但请看提案这不是我所希望的答案,但谢谢巴特!
有时,将平移(即像素偏移)应用于某个层而不是其他层是很有用的
例如,可以通过平移(即偏移一个层)直观地比较两个基于线的层
对于向量层,可以通过转换向量特征来完成。但是对于平铺图像层,例如,由GeoServer生成的道路交通信息平铺如何实现?这对于预合成和后合成处理程序也是一个很好的示例
在渲染层之前触发预合成,然后触发后合成。在事件处理程序中,您可以直接访问画布上下文,因此可以使用来偏移层的渲染
roads2.on('precompose', function(event) {
var ct
我认为这一切都是问题所在,我正在寻找一种方法,将地图的可滚动区域固定到它的图层大小
在我的例子中,我使用了一个宽度为2722px,高度为3850px的静态图像
我也检查了“范围”属性,但我真的不知道如何使其工作,出于我的目的
就这样,迫不及待地等待一些线索或其他答案:)
祝你有愉快的一天&代码
编辑:
OpenLayers还不支持您想要实现的功能。请参阅其中一位OL开发人员提供的
如上所述问题中的注释所示,您可以通过添加minZoom参数来限制ZoomLevel。您必须更改代码的这一部分:
co
是否有任何方法可以在不修改集合的情况下将过滤器应用于矢量源要素集合?只需选择渲染或不渲染哪些功能。我想这可以通过为过滤功能样式返回null来实现,但我想知道是否有更好的方法来实现。这取决于“渲染”的含义。如果您定义了一个样式函数来呈现某些功能,而另一些功能不呈现,那么您需要手动管理它们。如果您只需要地图视图范围内的要素,那么您可以在要素中循环并收集其中的要素。这有帮助吗?这个问题可以在这里回答:(告诉如何使用样式alpha或不透明度来显示和隐藏功能)我的意思是,样式函数中的过滤器甚至不会被过滤掉
我的SQL数据库中有一些SQLGeometrics,它们表示点并包含一个Z坐标
只要我使用ol.format.WKT().readFeature('POINT(1 2 3)'),{…}我就会得到以下错误:
Error: Unexpected `445.332` at position 29 in `POINT (600000.631 200000.848 445.332)`
at ol.format.WKT.Parser.prototype.parsePointText_ (http://
我试图检测在地图视图中看到的所有图层(OpenLayers 3)。
我尝试过这种方法,但它只适用于一个像素
map.forEachLayerAtPixel(evt.pixel, function(layer){
// And I edit the layer...
});
有什么功能可以让我做吗
谢谢。您应该能够在图层之间循环,并检查范围是否与视图范围相交。这将至少为您获得当前视图中具有一些像素的层
var viewExtent = map.getView().calc
ol.source.TileWMS和ol.source.WMTS之间有什么区别?到目前为止,我知道如果在WMS url中添加tiled=true,则两者都将在openlayers 3中返回平铺图像
提前感谢。OpenLayers文档说明:
ol.source.TileWMS从WMS服务器加载磁贴数据。
ol.source.WMTS从WMTS服务器加载磁贴数据
WMS服务于动态生成的图像,而WMTS服务于预渲染和缓存的分片。
后者的优点是可以获得更好的性能,但也需要存储空间
也请查看此答案:
我知
我提供两种口味的TMS瓷砖:256px或384px,通过renderd选项比例=1.5。
使用Openlayers 3,我发现要显示这些384px平铺的原始大小,唯一的方法是如下转换画布上下文:
map.getViewport().getElementsByTagName('canvas')[0].getContext("2d").setTransform(1.5, 0, 0, 1.5, -w, -h);
我认为这不是正确的方式,那么什么才是正确的方式呢
我玩了一点特殊的ol.tilegrid
我是OpenLayers 3的新用户。我在我的网页上用OL3添加了图层OSM,我用ol.layer.Vector添加了任何矢量图层(标记)。当缩放级别更改时,我需要更改向量层。请层具有setVisible()/getVisible()方法,以便您可以在特定的缩放级别触发层上的方法。可以在“moveend”事件上导出缩放,然后可以触发特定层是否可见
可以从map.getView().getZoom()中获取缩放(将返回缩放的数字),然后告诉需要相应显示或隐藏的图层
图层保存在集合(数组)对象中,可
我看到了这个链接:
但是,如何使标签具有所选颜色的背景矩形,以提高可读性(例如黑色矩形上的白色文本)?ol3当前不支持文本标签中的背景矩形。但是,可以使用较高的“轮廓宽度”值。试着把“6”作为“O.Width”放在上面的例子中,看看我的意思。它也提高了可读性。@AlexandreDubé我已经试过了,但输出不是我想要的。但是,在文本下面画一个矩形是不可能的吗?据我所知,ol3不支持这个功能,但也不是不可能的。您可以处理Pull请求,将其添加到库中。
我使用过谷歌api OverlayView。我能够使用像素值在latlng位置添加带有html div元素的自定义覆盖
USGSOverlay.prototype.draw = function() {
var overlayProjection = this.getProjection();
var sw = overlayProjection.fromLatLngToDivPixel(this.bounds_.getSouthWest());
var ne = overlayProjecti
我已经成功地建立了一个修改交互
ol.interaction.Modify()的文档不包含修改功能时触发的单个事件
与ol.interaction.Draw()不同,它工作得很好
我需要在修改特征后更新数据库中的坐标
如何设置侦听器?我找到了一个解决方案
高层解释如下:
基本上,您不会听取修改交互中的更改(就像您在绘制交互中所做的那样)。相反,您将侦听所选功能本身的更改
这里有一个简短的摘录:
// get the features from the select interaction
var
每当我缩放地图时,地图都会移动一点(上/下或左/右),比如一块瓷砖。如何使其在所有缩放级别上以相同的方式居中
因评论而编辑
不,当我放大时,它并没有完全放大右边的瓷砖,看起来它也移动了一点。我想我必须在图片中间设置缩放中心,而不是鼠标位置。我该怎么做?你想锁定中心吗?不,当我放大时,它并没有完全放大到正确的瓷砖上,它看起来有点移动also@JonatasWalker我猜是为了变焦技工。我不明白你需要什么。你能在网上展示这个吗?我上传了一个关于它的视频。如果你注意的话,你会发现它不能正确地缩放。特
我加载一个XYZ层作为
var layer = new ol.layer.Tile({
title: advanced.name ? advanced.name : "XYZ Layer " + new Date().getTime,
source: source ? source :new ol.source.XYZ({
url: url
})
我从一些数字化的地图图像中制作了一个zoomify tileset,现在我想使用OL3在网站上显示该地图。但是,我的脚本目前无法从本地文件uri加载该映射。稍后,在生产过程中,我将在某个Web服务器上上载磁贴,并使用HTTP引用磁贴。以下是我到目前为止的情况:
var url = 'file:///home/user/map_zoomfiy/';
var imgWidth = 17244;
var imgHeight = 9684;
var imgCenter = [imgWi
我用openlayers画了一张往返票。
不同的点具有如下样式:
new ol.style.Style({
image: new ol.style.Circle({
radius: 2,
fill: new ol.style.Fill({
color: 'rgba(1,0,0,0)'
})
}),
text: new ol.style.Text
我正在尝试将openlayers 3地图导出到PNG
此示例运行良好,但导出图像的宽度和高度是原始地图画布的两倍
如果地图画布为1330x440,则导出的png图像为2660x880像素
知道如何获得与画布大小相同的导出大小吗?这是因为您的设备像素比为2,因为您有一个HiDPI(视网膜)显示器
您可以使用{pixelRatio:1}配置地图并获得模糊地图,或者在ol.has.DEVICE\u PIXEL\u RATIO不相等时缩放导出的图像:
map.once('postcompose',函数(
我正在从事基于Angular CLI的项目。
我需要使用systemjs将OpenLayers3包含到我的项目中
当我在我的项目上设置systemjs以包含Openlayers javascript文件时,我遇到了错误ReferenceError:ol未定义
这是我的system-config.ts文件
const map: any = {
'ol': 'vendor/openlayers/dist/ol.js'
};
/** User packages configuration. */
我必须在ol3中开发一个功能,它能够在同一张地图上绘制许多自定义道路(轨道)。我想快速访问这些道路,因为我需要实时更新它们。为了实现这一点,我希望将每条道路组织起来并相互独立。从我的研究中,我注意到一个解决方案是将道路存储为一个段列表(每个段都是一个ol.特征),这些段存储在一个层(ol.layer.Vector)中。因此,主要思想是在单独的层中表示每条道路
如果增加ol3映射中的层数会对性能产生影响,有什么想法吗?或者,我如何重新思考我的想法,使所有的道路保持条理和相互隔离 为每条道路创建一个
我正在尝试在Windows 7上使用带有闭包编译器的编译应用程序构建openlayers-3的自定义应用程序。在运行closure util build选项时,我得到以下结果:
C:\Roy\websites\php\u js\u projects\closure compiler>node\u modules\openlayers\node\u mo
dules\.bin\closure util build config.json app.js
info closure util读取构建配
我很难找到一个通过ol3在geoserver平铺wms中避免重复标签的示例。有没有可能有人有链接或代码?
关于您可以使用质心函数在标签规则中查找几何体,然后大多数多边形将正确标记。唯一的另一个问题是它们落在瓷砖边缘附近的位置,然后需要在GWC中设置排水沟,以允许它们溢出
如何根据应用程序加载的配置文件设置矢量特征的样式?使用函数根据要设置样式的属性选择功能是有问题的,因为在运行时需要创建函数。任何关于如何实现这一目标的建议都将不胜感激。我想我已经完成了类似的工作。我在JSON中有样式定义,并在解释它并将其转换为样式函数的样式工厂中读取它们。我想你也可以做类似的事情。听起来怎么样?这正是我需要做的。。。你能分享你所做的吗?代码是我参与的一个私人项目的一部分。我不能按原样分享,但我可以解释。JSON由一系列规则组成。规则有两个键:过滤器和样式。如果功能与规则过滤器匹
我需要检测mousedown和mouseup事件,并在Openlayers 3地图上获取它们的坐标,但它似乎根本不起作用,我在文档中找不到任何关于这方面的信息
map.on('click', function(ev){ console.log(ev.coordinate);} );
工作正常,并且得到了正确的位置,但是当我用“mousedown”替换“click”时,它就不再工作了(我没有得到任何错误,只是什么都没有发生)
另一个解决方案是使用以下方法:
$(map.getViewport()
问题:
如何使用样式而不使用贴图将要素渲染到画布
背景:
我有一个示例,它将一个几何体渲染到一个符合ol3风格的画布上,但它只在openlayers的未构建版本(ol debug.js)下运行,因为它使用了私有函数(ol.vec.Mat4)
另一种方法是创建地图,添加矢量图层,设置要素的样式,将要素添加到图层,并从地图中删除所有事件/控件,使其看起来像画布
第二个是使用
第三个类似于第二个,我负责在使用ol.render.toContext之前将几何体转换为像素坐标,如本文所示
我想那会让人
嗨,有没有办法在Openlayers上触发全屏地图?我知道我们可以在地图上添加一个控件来触发全屏显示。但是我想知道是否有一些函数可以用来使地图以全屏模式显示?您可以在地图的getTargetElement上调用相应的方法,例如:
var element = map.getTargetElement();
if (element.requestFullscreen) {
element.requestFullscreen();
} else if (element.msRequestFulls
我在ol.interaction.defaults().extend()方面遇到了麻烦。我希望你能帮助我:)
我在for测试上重新实现了
var dragInteraction = new ol.interaction.defaults().extend([new app.Drag()]);
var map = new ol.Map({
interactions: dragInteraction,
layers: [
new ol.layer.Tile({
sour
客户在mapserver中有一个wms层,该层的最大宽度和高度配置为2048
当OL3发出getmap请求时,它可能会要求图像宽度超过最大值,并且生成的图像比请求的图像窄。生成的贴图图层将被偏移
是否有解决方法或错误修复
我们使用的是Openlayers的3.10.1版您可以在MapServer配置中增加最大大小,或用于将图像数据作为分幅加载。对于更高版本的Openlayers(OL3的最终版本以后)如果您无法访问服务器,并且使用TileWMS会导致标签复制问题,则有一种解决方法。首先,通过在
我想在openlayers中转换整个功能的坐标。我已经成功地使用ol.proj.transform将单个坐标转换为不同的投影,但是是否有任何函数可以为整个特征提供信息,并且该特征中的所有坐标都将转换为所需的投影?提前感谢您提供的任何帮助 我想你需要ol.geom.Geometry.transform
如果您有自己的功能,则可以执行以下操作:
src = 'EPSG:3857'
dest = 'EPSG:4326'
feature.getGeometry().transform(src, dest
可以在OpenLayers3上使用您自己的地图吗?如果是的话,我在哪里可以找到这些信息,如果你能提供给我,我将非常感谢;)
您好,
Tristan如果您想运行自己的mapserver,请查看。他们的网站上会有很多例子。你的问题太模糊了。请澄清你想做什么。
1 2 3 4 5 6 ...
下一页 最后一页 共 9 页