openlayers-3

Openlayers3: How to add a colored border around a marker icon?

这一生的挚爱 提交于 2019-12-12 05:59:42
问题 OpenLayers 3 renders's its marker icons as images on a canvas. Markers can have transparent background with non regular image icon. Is it possible to add a colored border of specific thickness and color using ol.interaction.Select ? 回答1: So I was able to achieve this by modifying the Icon Pixel Operations example on the OpenLayers website. It is possible to work with the icon image canvas in the styleFunction that ol.interaction.select provides, and first create a colored fill of the same

Geowebcache + Openlayers3 with XYZ source: error by zooming the map

非 Y 不嫁゛ 提交于 2019-12-12 04:25:53
问题 I'm trying the do the same map as here: Openlayers3: tile grid incorrect with pixelratio=3 using Geoserver/Geowebcache as backend but using the TMS protocol instead of WMS. The map works good but there is a little problem by zooming in, only by changing from zoom level 4 to zoom level 5: the map seems to "jump upwards". The problem occurs with all pixel ratio. This is my source code. Any help is appreciated: <!DOCTYPE html> <html> <head> <title>WMS Tiles</title> <link rel="stylesheet" href=

Scroll Bar in Openlayers 3 popup

一曲冷凌霜 提交于 2019-12-12 03:38:21
问题 In this example of OPenlayers 3 : http://jsfiddle.net/api/post/library/pure/ , I was trying to make the ol3 popup scrollable whenever the content in it is very large. I set the following style for popup content div :- <div id="popup-content" style="max-height:300px;overflow:auto;"> This inserts scroll bar if content is greater than 300 px but disables mouse events like zoom,hover,click etc. Could anyone tell why is this happening and what is the right way to add scroll in popup? 来源: https:/

OpenLayers: get pixel color from image layer

放肆的年华 提交于 2019-12-12 03:34:09
问题 I have a simple map with a static pixel image layer: <!DOCTYPE html> <html> <head> <title>Simple Map</title> <link rel="stylesheet" href="http://openlayers.org/en/v3.13.0/css/ol.css" type="text/css"> <script src="http://openlayers.org/en/v3.13.0/build/ol.js"></script> // reference to jquery here </head> <body> <div id="map" class="map"></div> <script> var extent = [0, 0, 2000000, 2000000]; var projection = new ol.proj.Projection({ code: 'xkcd-image', units: 'pixels', extent: extent }); var

POI in OpenLayer 3

一个人想着一个人 提交于 2019-12-12 03:27:00
问题 If load points from KML file to vetor layer var layerPOI = new ol.layer.Vector({ source: new ol.source.KML({ projection: projection, url: 'data/KML/mydata.kml' }) }) How can I do a complete listing of all loaded points (POIs) and loaded properties (from data/KML/mydata.kml)? I think, for example, into the table - in map view (display layer) I can is already Thank you very much for answer 回答1: ol.source.KML has a method getFeatures() which gives you all features in your KML. Then you can use

OpenLayers 3 select style

£可爱£侵袭症+ 提交于 2019-12-12 03:08:59
问题 In OL2 I was able to specify a "select" style in the style definition. In OL3 this doesn't seem to exist. If I understand it correctly, I can set a style for the select interaction. However, this likely won't work in my case since every layer has a unique "selected" style. Am I mistaken in my assessment of the capability? Is there another/optimal way to do this in OL3? 回答1: Let's assume that you have a style parameter stored in each ol.Feature , you can add a ol.style.StyleFunction to your ol

OpenLayers compute offset coordinates

让人想犯罪 __ 提交于 2019-12-12 00:02:56
问题 I need a way of drawing polygons with openLayers based on lat/long coordinates, rotation and lenght (in meters). Example: "I want to draw a line from point 1 (lat,long) to point 2 where point 2 is calculated based on the fact that it is located 115 meters with the rotation of 115 degrees from point 1" Google maps has an easy way of calculating coordinates by using spherical.computeOffset() method. Does OpenLayers has anything similar? Or are there suggestions of other nice open source

Creating an array from GeoJSON file in OpenLayers 3

南楼画角 提交于 2019-12-11 23:00:47
问题 I am using OpenLayers 3 to animate the paths of migrating animals tagged by scientists. I load the geoJSON file like so var whaleSource = new ol.source.Vector({ url: 'data/BW2205005.json', format: new ol.format.GeoJSON() }); Instead of loading this directly into a layer, I would like to use and reuse the data in the geoJSON file for different purposes throughout my program. For example, I want to pull the lat & lon coordinates into an array to manipulate them to create interpolated animated

getFeaturesAtPixel() to include decluttered (hidden) features

喜你入骨 提交于 2019-12-11 17:52:07
问题 Is there any way to get all the features in one layer at one specific pixel, including the hidden ones due to decluttering? Currently, when calling Map.getFeaturesAtPixel() (or Map.forEachFeatureAtPixel() ) those features are omitted. 回答1: getFeaturesAtPixel is designed to report on exactly what's rendered on the map. If you want to get all features at a specific location, you can use ol/source/Vector 's getFeaturesInExtent method for a small buffer (e.g. 2 pixels) around the coordinate you

How to limit MouseWheelZoom to only apply while shift key is pressed in openlayers3

风格不统一 提交于 2019-12-11 16:01:26
问题 I want mouseWheelZoom to only zoom the map while the shift key is pressed. But ol.interaction.MouseWheelZoom options does not include a condition. There is a handleEvent() method however. I can see that ol.events.condition.shiftKeyOnly(mapBrowserEvent) returns true if only the shift-key is pressed. So how can I override the handleEvent() method? using typescript: export class ShiftMouseWheelInteraction extends ol.interaction.MouseWheelZoom { public handleEvent = function(evt){ if (ol.events