I'm trying to return multiple features from two layers from a user click (one feature on each layer)?
I'm using openLayers 2.12. I have 2 vector layers containing polygons, and a container layer containing both.
When clicking where both layers contain a feature, only the layer2 feature is returned.
How do I also get the feature at layer1 of the same position?
Is there away to get a feature from a specific layer at a viewport position?
Explanation: the SelectFeature-Control uses the layers getFeatureFromEvent()method to find one feature for a click, hover, touch etc. event. If SelectFeature controls more than one layer, it glues the layers to a virtual single layer, therefore you get at max one feature in this case, too.
Your 1st question: if you want to select more than one feature, you can use the SelectFeature's selectBox(OpenLayers.Bounds) method: if you create a small Bounds from your position and call selectBox(), all features from all layers controlled by your SC intersecting your bounds get selected.
Your 2nd question: you may make up an OpenLayer.Event from your viewport position and call the getFeatureFromEvent() for the specific layer. This will of course return only one feature, even if a lot features are overlapping at your position.
Hope that helps a little.
Related
My leaflet app has two overlay layers. One of them has a lot of data, so that if the user selects it when not zoomed in pretty far, there is too much data to display without severely impacting the performance of the app (and the data is not useful at wide zoom levels anyway).
So when the user selects the layer in the layer control, the app checks how much data would be displayed at that zoom level. If it's beyond a certain threshold, an alert is given that they need to zoom in more to turn on that layer. The app has essentially vetoed the layer selection, but there seems to be no way to uncheck the checkbox input so that the UI is in sync with the internal state of the app wrt the activation of that layer.
I can programmatically remove the layer altogether, but I don't see any way to uncheck the checkbox input for the layer. Even a brute force approach by getting the layer control HTML container and walking the DOM doesn't seem to be feasible, as there are no IDs or unique attribute values that I can use to get a reference to the checkbox for the desired layer. I also tried removing the layer and re-adding it, but it comes back still checked.
Is there a way to programmatically uncheck the layer checkbox?
EDIT: Here's how I'm creating the overlay layer:
baseMaps = ...
map = ...
myBaseLayer = ...
myOverlayLayer = L.featureGroup();
myOverlayLayer.id = "theId";
let overlayMaps = {
"Base Objects": myBaseLayer,
"Overlay Layer": myOverlayLater
}
L.controlLayer.layers(baseMaps, overlayMaps).addTo(map)
Programmatically removing / adding your layer from/to map should automatically untick/tick the checkbox in the default Leaflet Layers Control.
What you describe sounds to need usage of minZoom option on your overlay layer. If I remember correctly it should also automatically reflect in the Layers Control when the layer is removed due to minZoom threshold.
In my GEOJSON data layer I have a set of about 20 regions. Each Feature has a GeometryCollection with two geometries: a Polygon to define the region, and a Point that gives the centre of the region.
I want the Polygons to be invisible, but show the Points on the map as markers.
Additionally, I want to be able to set the region markers as visible or invisible depending on zoom level.
Is it possible to show just the Points on the map, and set them visible / invisible separate to the Polygons? I know I can add them to the map as markers the normal way, e.g.
new google.maps.Marker(etc)
but ideally I want to use the stock data layer so I can turn the markers off and on without looping through an array.
GEOJson is basically a "features collection", which means it can contain various features (and feature types: Point, MultiPoint, Polygon, etc.).
In your use case, you could have your Polygons and your points as separate features. You can then do various things with each feature separately. You can remove a feature, or you can override its style.
You can use map.data.getFeatureById('your_feature_id'); then use one of the available methods of the Data layer, for example remove or overrideStyle.
As an example, please check this fiddle that demonstrates how you can add a few points (MultiPoint) and a Polygon to the Data layer, then hide/show only one feature.
Hope this helps.
I'm writing a web-site to show different isochrone over city-map:
http://130.192.68.210:8080/citychrone/citychrone.html
I have several MultiPolygon GeoJSON layer in my Leafletjs library based project. I would like that when a layer overlap another only one of this can be visible in the overlapping region. Each of this layer has an opacity less than 1, so is not enough to set the ordering of the layer on the map. I'm wondering if it is possible to give a priority to layer, so when they overlap just one of them is visible.
Another possibility is to make one layer an "hole" of another layer, it is possible?
Turfjs is great for doing geometric operations like this in Javascript.
In your case, you can create holes in a polygon by "erasing" parts of it, using turf-erase: http://turfjs.org/static/docs/module-turf_erase.html. The example on that page shows something similar to what you want to do.
Google Maps utility library comes with a full map canvas overlay[1] which is pretty useful to create canvas based visualizations or custom layers (instead of the tiled based ones)
The problem is that CanvasLayer is based on an OverlayView and it has to be on top of all the map layers. My questions are:
Is there a way to place an overlay in between two layers (i.e tiled layers) ?
Is there a better way to implement a full map canvas layer which can be managed in the same way other layers are? (using overlayMapTypes).
For sure there are nasty hacks that can be done changing the DOM to sort layers and overlays but I'd prefer to do in a way it won't break when the internal implementation was changed.
[1] https://code.google.com/p/google-maps-utility-library-v3/source/browse/trunk/canvaslayer/src/CanvasLayer.js
I'm not sure what you mean by "map-layers" , but when you mean the mapPanes :
A CanvasLayer is not placed on top of all mapPanes, by default it's placed in the overlayLayer-pane(which is the 2nd lowest pane of the 7 mapPanes).
But it must not be placed there, you may place it where you want to by using the paneName-option of the canvasLayerOptions(set it to any valid mapPanes-name)
When drawing an editable Polygon on a map using Google's V3 API, is there some event I could register for that tells me when one of the polygon's points (only made visible by the editable flag) is clicked? I want to be able to enable a user to draw a polygon, using right clicks, and "complete" the polygon by clicking on the first point plotted. I begin by creating a Polygon of one point, and add each successive point with each right-click. I use the mousemove event to create two "completion" lines, two fainter lines (two Polylines) from the last point plotted to the current mouse position on the map, and from the current mouse position on the map to the first ("anchor") point. When I click on that first point, I'd like to be able to "finish" the Polygon, by taking away these completion lines, inferring the intent of the user now to either edit the points already drawn with the handles the editable Polygon provides, or save the Polygon's coordinates to my application.
Is there a way to do this? (As I've written this, I've thought of one solution: create a small circle, invisible, around the first ("anchor") point, and detect when that invisible circle is clicked. But I wanted to see if there was something built-in in the API that I could use.)
Are you trying to roll your own polygon editor? I would suggest using the drawing library instead:
http://code.google.com/apis/maps/documentation/javascript/overlays.html#drawing_tools
Also see events section:
http://code.google.com/apis/maps/documentation/javascript/reference.html#DrawingManager