Skip to main content
5 votes
Accepted

Cutting circle into polygon in OpenLayers?

map.on('click', function(e) { const resolution = map.getView().getResolution(); const adjustedRadius = REVEAL_RADIUS * resolution; const circleGeom = new ol.geom.Circle(e.coordinate, ...
Mike's user avatar
  • 12.6k
5 votes
Accepted

Adding zoom to extent button to layers displayed in ol-ext LayerSwitcher in OpenLayers?

Zoom to extent button is shown for those layers that have extent defined. Layer brgm has extent, but layer layer_limit doesn't. One possible solution for this is to catch featuresloadend event for ...
TomazicM's user avatar
  • 26.2k
4 votes

Adding button in LayerSwitcher (Openlayers)?

This is really not a GIS related question but completely HTML/JS related one, but anyway, all you have to do is add a button HTML element in sidebar after <div id="layers" class="...
TomazicM's user avatar
  • 26.2k
4 votes
Accepted

Converting shapefiles from S3 to GeoJSON in JavaScript for web map

One possible way to convert Shapefiles to GeoJSOM is Shapefile.js library from Calvin Metcalf. All you need is to include https://unpkg.com/shpjs@latest/dist/shp.js and then call shp function to ...
TomazicM's user avatar
  • 26.2k
3 votes
Accepted

Events while one loads and when it finishes loading vector layer in OpenLayers v6

Instead of prerender and postrender vector layer events you have to use featuresloadstart and featuresloadend vector source events: my_layer.getSource().on("featuresloadstart", function () {...
TomazicM's user avatar
  • 26.2k
3 votes
Accepted

Creating dotted line in OpenLayers with outline and fill color for each dot

Use a style array and place the smaller dots on the larger dots [ new Style({ stroke: new Stroke({ color: 'rgba(0, 0, 0, 1)', lineDash: [0, 6], width: 4, }), }), new ...
Mike's user avatar
  • 12.6k
3 votes
Accepted

Extract extent of all features inside a vectortile source in OpenLayers

The source used in your code in an OGC source which can be loaded by OpenLayers using an OGCVectorTile source https://openlayers.org/en/latest/apidoc/module-ol_source_OGCVectorTile-OGCVectorTile.html ...
Mike's user avatar
  • 12.6k
2 votes
Accepted

Setting map view extent dynamically in OpenLayers?

Since view object has no .setExtent() method, one possible solution would be to create new view with the desired extent and set map view to that view. Code for function that sets map view extent ...
TomazicM's user avatar
  • 26.2k
2 votes

Drawing linestring segments in different colors using OpenLayers

With newer OpenLayers versions it's quite possible to color each segment of the line string with it's own color. Style function has to be created where line string geometry is iterated through ...
TomazicM's user avatar
  • 26.2k
2 votes
Accepted

Multiply line using style in OpenLayers

One possible solution is to use turf.js library turf.lineOffset method to create parallel lines in style function. Relevant part of the code to show two parallel lines for the same linestring could ...
TomazicM's user avatar
  • 26.2k
2 votes
Accepted

Retrying failed XYZ tile load in OpenLayers?

You are dropping through to Promise.reject() after setting timeouts so the status will be error, you should return after calling setTimeout. Also I am not sure if tile.load() has any effect if it is ...
Mike's user avatar
  • 12.6k
2 votes
Accepted

Encountering Uncaught (in promise) Error: Unsupported GeoJSON type: undefined in React.js using OpenLayers

readFeatures expects a GeoJSON feature collection, your data is a array of feature jsons which must be read individually: const vectorSource = new VectorSource({ features: data.map((f) => new ...
Mike's user avatar
  • 12.6k
2 votes
Accepted

autonavi / amap xyz tile layer appears shifted in OpenLayers (Chinese Web Mercator with GCJ-02 datum)

The Baidu layer will align with OSM (but not using https) by changing var y = tileCoord[2]; to var y = -tileCoord[2] - 1; (see https://github.com/openlayers/openlayers/issues/10374) For the amap layer ...
Mike's user avatar
  • 12.6k
2 votes
Accepted

Converting Mercator tile coordinate to an OL TileGrid coordinate in OpenLayers?

I'm not able to reproduce behavior you describe, where tile coordinates differ from internal OL tile coordinates. For example, this click event processing function: map.on('singleclick', function (evt)...
TomazicM's user avatar
  • 26.2k
2 votes
Accepted

Line string label text letters overlapping in OpenLayers

One possible solution for this particular case would be to use style function where new two point line string geometry is created in the middle of the original line string, with screen length ...
TomazicM's user avatar
  • 26.2k
2 votes
Accepted

OLcesium how to load a 3d terrain from mapTile Cloud

The quantized mesh will let you see terrain as in https://docs.maptiler.com/cesium/ it will not fill the holes at the poles, and the format is not supported by OpenLayers. To display the mountains in ...
Mike's user avatar
  • 12.6k
2 votes
Accepted

Updating OpenLayers ZoomToExtent control

If you use a named variable for the array used to construct the control var extent = [73.19, 15.12, 81.80, 22.77]; var zoomToExtentControl = new ol.control.ZoomToExtent({ extent: extent }); You can ...
Mike's user avatar
  • 12.6k
2 votes

Which method to calculate distance from coordinates

When you reproject to a projected coordinate system, the distance method is probably using a planar calculation. 5634, for instance, uses Lambert conformal conic and is centered in Europe so more ...
mkennedy's user avatar
  • 18.9k
2 votes
Accepted

Cannot set a style to a feature in OpenLayers

If you look at the docs of .setStyle method, you'll see that it does not return any value, so you can't use it as input to .addFeature method. You have to do it in two steps: this.#bufferedAsOLFeature....
TomazicM's user avatar
  • 26.2k
2 votes
Accepted

Transform GeoJSON from EPSG:31983 to EPSG:4326 in OpenLayers

To convert CRS of GeojSON features from EPSG:31983 to EPSG:3857 when reading them with .readFeatures method, you first have do define EPSG:31983 projection to be used during conversion (see example ...
TomazicM's user avatar
  • 26.2k
2 votes
Accepted

Basemap with one selector

After exporting, edit the layers.js file contained in layers folder. Find your layers and define the property 'type': 'base' in the variable new ol.layer.Tile({ Here is an example:
andreaordonselli's user avatar
2 votes
Accepted

OpenLayers 9, distance between lines

If you use JSTS integration (example in https://openlayers.org/en/latest/examples/jsts.html) you could find the distance between any of the supported geometry types. If would be best to use EPSG:3857 ...
Mike's user avatar
  • 12.6k
1 vote
Accepted

OpenLayers add features to vectorLayer from GetFeatureInfo query in TypeScript

Alright, I found out the issue spotted on Github here. I'll do a typing workaround (like described in the issue) waiting for a bugfix release. If there is no better way to do so, I will accept my own ...
FloCAD's user avatar
  • 33
1 vote

How to use Vector layer with MapBox style JSON in OpenLayers 8

Each entry in the layers array in the style needs a "source-layer" property which matches a "layer" property in the features from the tiles, for an example see https://codesandbox....
Mike's user avatar
  • 12.6k
1 vote
Accepted

Passing query params to SQL View in GeoServer

No, that's not possible with out some client level coding. GeoServer does provide a series of environment variables including the wms_scale_denominator variable that may be what you need.
Ian Turton's user avatar
  • 82k
1 vote

Multiply line using style in OpenLayers

This solution is based upon Leaflet plugin Leaflet Polyline Offset. Coordinates are first converted to map pixels and the offset is then done on pixel coordinates. In Leaflet pixel coordinates are the ...
TomazicM's user avatar
  • 26.2k
1 vote

Converting Mercator tile coordinate to an OL TileGrid coordinate in OpenLayers?

Slippy map tiles The system to load tiles using the {zoom}/{x}/{y}.png filenames is called 'slippy map'. You can calculate the x and y values from the geographical coordinates (WGS84) using these ...
peter's user avatar
  • 909
1 vote
Accepted

qgis2web: pop up options inside grouped layers

Groups are not supported in qgis2web. For OpenLayers export, the only way is to export the project and then edit the layers.js file as per this example var layersList = [ new ol.layer.Group({ ...
andreaordonselli's user avatar
1 vote

Using COG images uploaded to Amazon S3 ( private bucket) with credentials in OpenLayers?

GeoTIFF source ol.source.GeoTIFF has option sourceOptions where you can specify additional options for geotiff.js on which OL GeoTIFF is based/dependent. GeoTIFF source options (see https://openlayers....
TomazicM's user avatar
  • 26.2k
1 vote
Accepted

Changing closeBox color of ol-ext PoupFeature in OpenLayers

You just have to change the popup close button background color in CSS. To set close button color to red: .ol-popup .closeBox { background-color: red } This is the result:
TomazicM's user avatar
  • 26.2k

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