Skip to main content
27 votes
Accepted

Detecting zoom change in OpenLayers

To hook on zoom end event is fairly simple: listen to moveend event and compare old and new zoom: var currZoom = map.getView().getZoom(); map.on('moveend', function(e) { var newZoom = map.getView()....
TomazicM's user avatar
  • 26.2k
25 votes

Openlayers v4.0.1 support Google Maps Javascript API?

I can use Google Maps in OpenLayers 4.2 like this under my WMS layer and its perfectly fitted with EPSG:3857 projection: new ol.layer.Tile({source: new ol.source.TileImage({ url: 'http://khm{0-3}....
Ömür Bilgili's user avatar
20 votes

Add properties name label or id to a feature

You have an error in how you use the setProperties method. It is intended to set multiple properties at once and takes an object as input, which contains a list of key-value pairs: point_feature1....
rbkb's user avatar
  • 656
19 votes

Why Google Maps is not popular with tech stack like Leaflet, OpenLayers, nebula.gl?

It's because the TOS of Google Maps only allow you to consume their imagery and maps using their API. See Section 3.2.4 e) from https://cloud.google.com/maps-platform/terms/#3.-license- (e) No Use ...
ThomasG77's user avatar
  • 31k
17 votes

OpenLayers-3 setting zoom so layers fit in map window

According to this answer at StackOverflow, the functions have been renamed in OpenLayers 3.7 and later. This is what works for me in OpenLayers 3.15.1: var extent = my_vector_layer.getSource()....
Dirk's user avatar
  • 1,851
16 votes
Accepted

How to unlisten an event in OpenLayers 4?

Try to wrap your callback function in a separate function. Something like that: //here is you callback function function myCallback(evt){ var popup = new ol.Overlay.Popup({insertFirst: false})...
pavlos's user avatar
  • 3,538
15 votes
Accepted

What is meant with EPSG:4326 projection

You've got a good grasp of it. EPSG 4326 (i.e. WGS 84) is not a projection. But if you don't associate a projection to this geographic coordinate system, and naively render the coordinates as x/y ...
alphabetasoup's user avatar
13 votes
Accepted

What are the possible listeners and event types for an openlayers map (ol.Map)?

Perhaps these could be useful. http://openlayers.org/en/latest/apidoc/module-ol_MapBrowserEvent-MapBrowserEvent.html http://openlayers.org/en/latest/apidoc/module-ol_events_condition.html change (...
pavankguduru's user avatar
11 votes

Show/hide features on layer in OpenLayers?

One approach is to change the features' style. In order to hide a feature, you can set its style to an empty style object: myFeatureIWantToHide.setStyle(new ol.style.Style({})); To show this feature ...
Mesa's user avatar
  • 1,512
10 votes

Disable doubleclick zooming in OpenLayers 3

If you want to disable doubleClickZoom after map initialization, here is the way: var dblClickInteraction; // find DoubleClickZoom interaction map.getInteractions().getArray().forEach(function(...
Chase Choi's user avatar
  • 1,087
10 votes
Accepted

Undoing last point when drawing linestring in OpenLayers 3?

Since OpenLayers 3.9.0, this is as simple as using the removeLastPoint method of the DrawInteraction. So you can do something like this: document.addEventListener('keydown', function(e) { if (e....
dbaston's user avatar
  • 13.1k
10 votes
Accepted

Avoiding CORS error with OpenLayers 3?

Unfortunate, what you are experiencing, is expected behavior, and not a Bug. Once you add an Image from an external domain, or cross-domain, and use it on the canvas, the canvas becomes "tainted" and ...
Devdatta Tengshe's user avatar
10 votes

Openlayers v4.0.1 support Google Maps Javascript API?

It's possible to us ol.source.Tile to access to every google maps. For everybody needs it, this is the basic code to create every available google maps layer to add to a map developed in Openlayers 4: ...
Alessandro Battistini's user avatar
10 votes
Accepted

Openlayers 4 unselect a feature

You can simply add the following line within your closer click event: select.getFeatures().clear(); select.getFeatures() will return the currently selected feature(s), and clear() will remove them ...
rbkb's user avatar
  • 656
10 votes
Accepted

Forming queries with node.js, PostGIS and GeoServer?

It is not easy to get the open source based overall web-mapping architecture. When we use open source, we can combine many tools. Sometimes, we just get one or two features of a tool. We have many, ...
jgrocha's user avatar
  • 5,415
10 votes

OpenLayers: How do I remove a layer based on a value?

One option is to get the collection of the map layers using the getLayers() method. Then get a reference to the underlying array of layers using the getArray() method. Now that you have an array of ...
Josh Crozier's user avatar
10 votes
Accepted

How can I add satellite map in OpenLayers 5?

All data sources will have terms of use (such as displaying attributions). If you want one without an API key try source: new ol.source.XYZ({ attributions: ['Powered by Esri', ...
Mike's user avatar
  • 12.6k
9 votes
Accepted

How to force a ol.source.Vector to reload data from server?

I had the same requirement, loading a subset of data when zoomed out and loading more of that data when zoomed in. I solved it with help from this question: reload ServerVector with different zoom ...
rbkb's user avatar
  • 656
9 votes
Accepted

Map IDs to add Mapbox basemaps to Leaflet or OpenLayers

Let me quote from https://www.mapbox.com/api-documentation/#maps : If you use Mapbox.js, Mapbox GL JS, or another library like Leaflet, you're already using this API. This documentation is geared ...
IvanSanchez's user avatar
  • 10.3k
9 votes
Accepted

Get feature from ol.interaction.Draw on drawend

Best solution I've found so far is to use the current feature embedded in the event: var radiusSelectInteraction = new ol.interaction.Draw({ source: circleLayer.getSource(), type: 'Circle', ...
Hank's user avatar
  • 325
9 votes
Accepted

Uncaught TypeError: layer.getLayerStatesArray is not a function

You must give "ol.layer.Vector" object to addLayer method. For example: var vectorLayer = new ol.layer.Vector({ source: new ol.source.Vector() }); self.Map.olMap.addLayer(vectorLayer);
vsendag's user avatar
  • 106
9 votes
Accepted

Openlayers geojson projection issue

The features are in EPSG:4326 coordinates, they need to be converted to 3857. either: new ol.format.GeoJSON({ featureProjection: 'EPSG:3857' }).readFeatures(geojsonObject) or: new ol.format....
Mike's user avatar
  • 12.6k
9 votes

Import from in Openlayers

Running OpenLayers examples in a browser The examples provided are not able to run on the client side (on a browser). Let's see an example. Typical OpenLayers example One very simple example of ...
jgrocha's user avatar
  • 5,415
8 votes

Is there a On Map Move event in OpenLayers?

In OpenLayers 3 you have moveend, an ol.MapEvent triggered by the map itselft. Use it this way: map.on("moveend", function(e){ // event actions }); This event is triggered in many ways, after ...
I.G. Pascual's user avatar
8 votes

Add GeoJSON layer to OpenLayers 3

The OpenLayers Vector API is changing a lot. I have a working sample with OpenLayers 3.16.0. It's important that you must define featureProjection: 'EPSG:3857' in the options of readFeatures like ...
hoogw's user avatar
  • 1,752
8 votes

Convert Lon Lat to XY in Openlayers 3

I was looking for this function too, and I have found it in some of the examples on their site. You can use ol.proj.fromLonLat([19.062072, 47.473478]). http://openlayers.org/en/v3.13.1/apidoc/ol....
Isti115's user avatar
  • 193
8 votes

Update a feature's coordinates/geometry

So apparently setGeometry does not work in the way which I expected. Rather than using: item.setGeometry(modifiedCoordinate); It is necessary to use: item.getGeometry().setCoordinates(...
dvmac01's user avatar
  • 1,065
8 votes

Identifying OpenLayers 3 version at runtime?

Searching through the OL code reveals that the version number is included in only two places. Firstly, in the comments on the 3rd line. So if you wanted you could parse the ol.js file itself. But ...
Son of a Beach's user avatar
8 votes

Openlayers3 Add click/hover action on ol.layer.Vector

for the hover interaction you can use this code: hoverInteraction = new ol.interaction.Select({ condition: ol.events.condition.pointerMove, layers:[yourLayer] //Setting layers to be hovered }...
Hicham Zouarhi's user avatar
8 votes
Accepted

Drawing/updating feature "during" drag on OpenLayers 3?

The problem is in your vector layer. You have to use updateWhileInteracting: var vector = new ol.layer.Vector({ updateWhileInteracting: true, ... }); As written in the API this might cause ...
Lars's user avatar
  • 2,197

Only top scored, non community-wiki answers of a minimum length are eligible