OpenLayers: destroyed features reappear after zooming in or out - javascript

I have an OpenLayers + Bing mapping application that shows hazardous waste sites. A user can click a link to toggle a site's subsites on the map.
When I toggle the subsites off (which are points on a Vector layer) by calling destroyFeatures() on the layer, they disappear as expected. However, if I zoom in or out on the map, certain of the subsites reappear. This doesn't happen when moving the map, just zooming.
The ones that mysteriously reappear are coincident sites, i.e. two sites with exact same coordinates. Both get destroyed, and both reappear.
Why would these get destroyed from the layer, then reappear when zooming?
(OpenLayers version is 2.11)

Try this, it worked for me
layer.removeAllFeatures();
layer.destroyFeatures();//optional
layer.addFeatures([]);

Keep in mind that destroyFeatures() changes index of objects in vector. If you use indexes in your code, this may cause problems.

Are you sure you send ALL features as a parameter to destroyFeatures() method? An easier way to remove everything is just to call removeAllFeatures() method. If you want to hide and show features when user toggles subsite then it's even better to use show() and hide() methods on vector layer.

Related

hide clustered overlays from map when page loads

I'm using the leaflet styled layer control, marker cluster and marker cluster layer support plugins to create overlays that you check on or off in the layer controls.
Everything is working perfectly, except that I want the map to be blank when the page first loads, and the user can choose which overlays they want to turn on. I've tried the built in methods for the styled layer control for this but they don't work.
Through trial and error I've figured out the issue is this:
var markerClusters = L.markerClusterGroup.layerSupport().addTo(map);
//monday groups
var mFood = L.layerGroup().addTo(markerClusters);
var mDrink = L.layerGroup().addTo(markerClusters);
var mEntertainment= L.layerGroup().addTo(markerClusters);
if I don't add the markerClusterGroup to the map, the overlays do not appear until the user checks them in the layer control. However, this means the markers do not cluster. I feel like the issue could be solved with an if..then.. loop, but I'm not sure how to create this.
For example if an overlay is checked, add the markerClusters to the map. I worry though that wording it like this would mean all overlays are checked/markerClusters appear and I only want the checked overlay to appear, and be clustered if necessary.
As a general rule, your overlays will be on map as soon as you use myOverlay.addTo(map) or addTo(group) where group is itself already on map.
As you figured out, this is exactly what happens if you avoid adding your markerCluters layer support to the map. But then you have issues with your overlays as you describe.
To overcome these issue, look at layer support checkIn method: it "registers" an overlay to be clustered later on, but without adding it right away into the cluster group.
Therefore you still add the layer support group to your map, but you just check in your overlays so that they do not appear now on map, but will appear clustered when user selects them later on.

How do I filter GeoJSON/TopoJSON data by coordinates?

I have large files (~100mb each) with GeoJSON/TopoJSON data.
These have states and counties boundaries. States layer loads just fine as it doesn't have so much data, but the one with counties just makes page crash in Chrome.
So, files themselves load from network and are parsed properly, but when it comes to putting them on a Leaflet map, it freezes and crashes.
As a solution, I wonder if I can filter features by their coordinates?
I can get viewport boundaries of the map.
Are there methods I can filter features with coordinates that are inside some boundaries?
This way I could filter only those that should be rendered in the current view and ignore the rest, then repeat this routine on map/zoom.
First of all, Leaflet has a getBounds() method that you can use in order to load only the features that are inside the Bounding Box. This could be done by triggering the getBounds() method when the map "moves" (zoom, dragging), using the moveend event.
So, basically:
map.on('moveend', function() {
map.getBounds()
//erase the features you had on the map
//Then load on the map only the features with coordinates inside the Bounging Box.
}
Of course, the above is just an approach. Every time the map "moves", the previous feautures are erased and new ones are loaded. It may result to slow loading of features but you may have to live with it for so large files.
Also, you can experiment with the code by, for example, loading the new features and then erasing the old. In addition, you can load features for a Box bigger than the Bounding Box.

Ordering / z-indexing overlays on Google Map

I'm adding 2 overlays - a Demographics Layer and a Fusion Tables Layer - to a Google Map. The problem is that I need to order these layers so the Fusion Tables Layer is always on top of the Demographics Layer. It seems that whichever one I call "setMap(map)" on last is on top, but I have functionality for toggling the Demographics Layer on or off using setMap(null) and setMap(map)... but whenever it is toggled on using setMap(map), it shows up on top of the Fusion Tables Layer.
if (checkbox.checked) {
demolayer.setMap(map); //added on top
} else {
demolayer.setMap(null);
}
Is there another way to order overlays besides making sure you call setMap(map) on the layer you want on top last? I've tried z-index properties with no luck. Any help is much appreciated.
You wrote:
Is there another way to order overlays besides making sure you call setMap(map) on the layer you want on top last?
Not that I have seen. The work around is to always remove both layers and add both back in the order you want them displayed.
You might want to "star" these enhancement requests or adding a new one (I don't see a general "allow control relative z-index of layers" enhancement request):
http://code.google.com/p/gmaps-api-issues/issues/list?can=2&q=layer+z-index
http://code.google.com/p/fusion-tables/issues/list?can=2&q=z-index

Google Maps - Changing the pane order of tile overlays?

A continuation of my previous question: How to change the layering of KML and Tile Overlays in Google Maps?
I am currently rewriting some of the code regarding the buttons which enable and disable tile overlays using arrays. In doing so, I'm trying to combine all of the button's individual functions into a single function, but since I have two methods of rendering the overlays, I was hoping to try and simply focus on only one method. The first uses "overlayMapTypes":
map.overlayMapTypes.insertAt(0, beloitMapType);
The second, using a script provided in my previous question:
this.getPanes().overlayShadow.appendChild(this.settings.div_);
The former method is my original approach; however, since I use polygons on the Satellite view I needed a way to place icon/name overlays above the colored polygons. To achieve this, I sought something akin to the latter method where certain overlays could be placed onto a pane higher than the polygons and thus appear above them.
However, in the time between my previous question and now, as well as through some of my own research, I've come to realize that the latter method, rather than placing the tiles into their places, estimates the location of the tile and places it as an image overlay. As a result, a part of my accessibility layer which colors in inaccessible paths had been misaligned by a pixel or two, or my building name overlay currently has names on the border of two tiles which have a sharp line through them as those two tiles overlap slightly. In addition, these two issues come and go each time the map is loaded with each tile being placed on the map with a variance of 1-2 pixels in any direction.
Thus, I would very much prefer to use the former method with overlayMapTypes, which is more reliable and accurate, on all of the overlays, but I also need a way to bring some of these overlays higher than the "overlayLayer" pane and above the polygons. Is this possible and, if so, how could it be done?
Addition: I have an additional need to try and find a method to achieve the reassignment of panes with the overlayMapType method: the script I'm using to achieve this doesn't appear to work in IE7/8. I'm going to investigate this angle myself, but I'd still prefer to drop the script entirely if possible.
Well, I've hit upon a possible solution and, for the sake of sharing it, allow me to explain:
Polygons do not necessarily need to be visible to still have click and hover events.
Since the polygons are used to color the buildings and poi in Satellite view, such a visual component could easily be done by an overlay.
Thus, a possible solution is to have all polygons invisible and simply use them for click and hover events. Likewise, a second overlay, or a modification of an existing one, would replace the polygon's original visual component. Since this visual component is now an overlay like everything else, it can be easily layered with any other overlay using the "MapType" method.
(This however doesn't answer the question; namely, can tile overlays and polygons be layered only with the MapType method? I would still like to know that, but in the event that there is no answer, this hopefully is a possible alternative.)

Custom InfoWindow size/pointer position in Google Maps API

I have a map application that can be seen here:
http://chrismcaleenan.com/map/?page_id=25
Each of the Malaysian states in the application will have an InfoWindow that displays additional information. You can see an example of this by mousing over 'Kedah' either in the main data table on the right or on the state itself in the map.
The problem, as you can see, is that the map pans in order to position the InfoWindow. Is there a way to fix the map position and set the InfoWindow size or position so that it is fully displayed without panning? In the Kedah example, one could have the InfoWindow positioned directly to the right and/or use a shorter tail.
One option would be to create a custom graphic for each state, but I'd rather avoid this as I will be running into the same issue with add'l data (e.g. click Kedah to zoom - will have InfoWindows on all data points on zoom).
If you're playing around double-clicking the water will zoom back out and reset map.
Thanks!
Yes, and sometimes the pan pulls the mouse outside of the state, which causes the InfoWindow to disappear. I know that's not what you want. The Google Maps demo catalog includes a sample that I think will give you what you want for your map. It's named SmartInfoWindow. Take a look, click on some of the markers, check out how the SmartInfoWindow behaves, and see if that might help you achieve what you want. It's not perfect, but it keeps the pan at the absolute minimum.

Categories