Disabling interaction in OpenLayers - javascript

I have a silly problem with an OpenLayers Map where I want to show a non-interactive picture on one site, where all clicks and such are disabled. I've tried capturing the clicks on the element but OpenLayers seems to still be able to get these events which makes the map interactive. There should be a simple solution to this but I can't figure it out.
Setting the control property to the empty array does not have any effect on the interaction.
Edit: We could not find a way to do this easily on an already existing map, so what we did was to re-use the old map initiation code in this new page, with added parameters that can remove all controls upon the creation and initiation of the map.

Setting the control property to the empty array does not have any effect on the interaction.
Wierd, this should do the trick:
map = new OpenLayers.Map('map', {controls: []});

Related

Leaflet - Allow dragging outside of map

I recently set up a non geographical map with leaflet using an image layer. This obviously is a stupid decision working with 'bigger' maps due to high memory usage and the need to load the big image file so I decided to use a tile layer instead.
Working mostly as expected aside from one thing: I can't seem to be able to drag outside of the map, it just jumps back so the map covers the screen. I'm not sure what causes that as I read that this behaviour usually needs to be set manually using maxBounds. Tried setting that to null, doesn't change. The only new thing introduced is Leaflet Rastercoords (https://github.com/commenthol/leaflet-rastercoords) which I'm unsure if that's causing the problems.
Any way to resolve that? Not sure where to look next.Thank you!
I achieved the behaviour you want using the following work around:
map.setMaxBounds(null); //map being the leaflet map.
This need to be called after the initialization of the map and of the raster coords layer.

Implement "search as I move the map" using Leaflet

I want to implement Airbnb's "Search as I move the map" using Leaflet. On the one hand, if a user pans the map I want to load data associated with that portion of the map, on the other hand, I don't want to make unnecessary requests (e.g. making a request every time the user slightly changes the map).
I see Leaflet provides a moveend event which is "Fired when the center of the map stops changing" but doesn't have any new location associated to it that I can use to make a new request. Also, it's probably fired too many times for this use case.
Which events should I listen to? How should I implement "search as I move the map"?
You can call map.getCenter() or some of its friends (eg map.getBounds()) from within the moveend event to find out where the map was panned to.

angular-google-maps windows options usage and customizing it

Hi Pardon me if this is repeat question or obvious one as i am new to programming
I am trying to implement an angular google map using this api. it has a property called options boxClass,boxStyle,content,disableAutoPan,maxWidth,pixelOffset,alignBottom,position,zIndex,closeBoxMargin,closeBoxURL,infoBoxClearance,isHidden,visible,enableEventPropagation as different values(seen from the JS file.)
Now i want to know what each one of those will do as it is not specified in their documentation. and mostly i wanna know how i can make the info window to appear on rightside of marker like shown here I designied the html for the infobox and when i give boxClass as the option the infobox is rendered properly but is displaying below the marker. i want it to be to the side of marker.
EDIT: let me clarify on certain points. I mainly wanted to know
1.how to remove the default close button and replace with mine. (which function to call for it to work )
2.how to use pixelOffset or another property to help me display the infobox to the side of marker as in example above without using margin or padding. gmaps api v3 specify the pixelOffset to be of type size. i tried various ways to offset the infobox so that it will shift but it seems i am using it wrong as the box either wont change its position or will be displayed at the top of map irrespective of the marker.
A lot of them are CSS properties that changes appearance and not really maps term. You can google them or learn from here.

Swiching between two sets of markers with Google Maps

I am using Google Maps Javascript API and in my website I would like to show people and places but not at the same time. The user should be able to switch from first set of people markers to a set of places markers.
I can simply remove all the people markers and then put all the places markers but it seems like there is another way to do the switching using the OverlayView class.
How does it work ?
It might first seem clumsy but markers itself are overlays and removing and displaying them "by the book" is done keeping references to them using array and looping through setting for example marker.setMap(null) I digged out for you docs example which demonstrates well how you need to play with them. I have used them in a past (displaying and removing) never faced real performance issues, its relatively fast.
Key is not to delete them completely until you want, just setting their map null removes them from the map. Always keep them in a array if you need to display them again. For your case I would either made two arrays of markers or just one array where markers has parameter such as marker.myType="people" which you can use to check against when looping and doing things.

How to update (dynamic) marker-icons with live-data?

Hey folks,
I was wondering, if it's possible to create marker-icons that can be updated/altered as soon as the AJAX-function pulls new data from the server. To give you an example:
I have several markers representing different people. Now if one of them posts a new message to the system, AJAX fetches it and passes is to the Map-Object. Now I'd like to pop this (event) into the map by either opening an InfoWindow next to that person, or - and this is the preferred way - to add a tiny red icon next to the marker-icon, just like you know it from the top-navigation in Facebook (e.g. you have 5 new messages and 3 friend requests).
And if the icon is clicked/the InfoWindow open, I'd want to remove that extra icon from it.
Is there any possibility to do this? And what would be the fastest (in terms of benchmarking) way to go with? Maybe with additional overlays? Or would I have to calculate the pixels within the viewport and add onto it?
Now it's your turn... :)
Thanks a lot!
The easy way would be using setIcon() function of the Marker class.
It is quite possible to use another overlay and the trick is to calculate the pixels within the viewport. You can avoid that by using a transparant 'red icon' and overlays it on top of the existing icon using the custom overlay classes (http://code.google.com/apis/maps/documentation/javascript/overlays.html#CustomOverlays) by using the position of the icon.
If you really want to calculate the pixels, you can search for 'google map contextmenu' and refer to how people do the calculation.

Categories

Resources