I create Bing Maps AJAX control and initialize it with always the same values: lat, lng and zoom level. This is a default aerial map type and a maximum zoom level. And every time I get the following image:
http://i50.tinypic.com/acturr.jpg
There is no documented method (or not) to refresh the current area so I should to do zoom out and zoom in using mouse every time, it's annoying. For Google Maps I found a useful trick:
google.maps.event.trigger(this.map, 'resize');
Does Bing Maps AJAX API have something similar?
I have recently encountered a similar issue on Bing maps AJAX V7:
On some browsers (Mostly on Chrome), if the map is not present on the viewport (you have to scroll to reach it), then it initializes improperly.
I have reported the issue to MSDN but didn't get any useful answer: https://social.msdn.microsoft.com/Forums/en-US/439c33bc-a1ed-4e74-a019-f7fecb809030/scroll-issue-on-chrome-with-ajax-v7-control
To fix this issue, I have used two things:
First of all, I had to find a way to force the Bing map to refresh (didn't found any solution on the internet nor object method to do that). After a lot of tests I came out with a solution:
map.setMapType(Microsoft.Maps.MapTypeId.mercator);
setTimeout(function(){map.setMapType(Microsoft.Maps.MapTypeId.auto);}, 1)
Indeed, changing the viewport to "mercator" then back to another forces the map to refresh (the setTimeout makes the action asynchronous)
I then have added a lib that triggers an event when an element is entering the viewport in order to trigger the force refresh every time the map enters the viewport
Related
I am currently working with HERE Maps API and I currently have a traffic toggle up and working. The problem I am having is that when I toggle on the traffic layer using this method it seems to not render. I have to zoom in quite a bit on the map to actually see the traffic layer get rendered in. Is this how it is designed or is there a way to view traffic from a further zoom level?
With H.ui.ZoomControl.Options, default zoom level while rendering for a map can be changed. If you think that you really need to zoom a lot after the traffic layer gets loaded, you can optimise using that. After that, can set zoom_min and max value to further check the traffic details in the map.
Please refer following link to further check for zoomcontrol options >
https://developer.here.com/documentation/maps/3.1.14.0/api_reference/H.ui.ZoomControl.html
I have an web application, written using Angular.js and angular-leaflet-directive, that displays a selection of roads on a map. I have included some bookmarks for easy navigation to certain areas and so was basing map extent navigation on using the center and zoom attributes.
I am now also including functionality to determine whether a road is visible in the current map extent, using:
map.getBounds().contains([roadLatA, roadLngA]) || map.getBounds().contains([roadLatB, roadLngB]), where A and B refer to the end points of a road.
This works perfectly on page load but after any sort of interaction (e.g. drag, zoom events) when getBounds() is called again, it returns the same LatLng for each corner of the bounding box, which are the values that are set as the default center coordinates. After a lot of refactoring I cannot find a way to incorporate both center and getBounds() successfully.
Is it possible or is there a limitation within either angular-leaflet-directive or leaflet.js that means the two methods of setting map extent conflict with each other?
I have now resolved the problem, the issue was in calling leafletData.getMap() without passing in the id of the map element.
This behaviour was throwing me as the initial getMap() call (without an id) was returning the correct map object, but on subsequent calls (after user interaction) the $promise was not being resolved and so I wasn't getting undefined or any other errors. I guess the getBounds() function was then being called on the wrong map object.
I would like to show newly (optionally) loaded GeoJSON features. For this I need to center somewhere around their bounding box center. I'd like to do that on client side instead of making yet another request to get center coordinates from the server.
For instance if I'm showing the only point feature, it would be reasonable to getFeatureById (as I know id) and get its geometry and corresponding LatLng. However as far as I know Google Maps is using asynchronous loading so I can't do it right away. I recall a question in here that I can't find anymore that mentioned that.
So how would I center on features acquired with loadGeoJson or what event shall I listen to when it is done loading all features?
Do I have to listen to google.maps.Data.AddFeatureEvent? That would work for a single point that I know ID of, but what shall I do for several features?
I have answered that question on this posting : do centering with the centers of the layers -->
OL3: Zoom to vector layer on map
Hope it works for your case.
I have a geolocation map where the user can select a location from a dropdown, this then adds the location to the map as a marker. However I have just implemented code to update the geolocation of the person if they are moving, on this function update it refreshes the entire map and removes the marker of the location.
Is there a way around this whole map refresh, something like updating just the marker postion without refreshing the whole map or is it simply a case of grabbing the location before refresh then adding it back in afterwards?
This seems wasteful on resources though as it updates every 3 seconds.
Example Google Maps API code would be great as I don't currently have mine to hand to show as example.
Summary: I wish to be able to update the user position marker without refreshing the whole map div as this then removes any previously added markers.
Thanks
I think there is a lot of different way to prevent that. check out the google.maps.Map class and its methods in the API documentation.
How to disable all effects and animations in google api v3? Is there some equivalent of jQuery.fx.off? If google api used some base library like jquery that would be easy... but this is probably not the case. I just want to disable them ALL. For example:
animated zoom
fading layers on layer switching
InfoWindow anchor is animated when InfoWindow is added, also map pan is animated in this case
... etc.
Or, if disabling them all is not possible, how to disable the particular effects listed above?
It is needed for running it in IE6 which is very slow (note that google api v3 seems to work in this browser), also desirable for other IE versions on slower computers.
There's no general "turn everything off" facility. You need to select what you want to turn off and do each individually, if that's actually possible...
You can't disable animated zoom. This is the subject of a long-standing enhancement request which has been marked WontFix.
There's no option to disable layer-switch fade. I don't think there's an enhancement request, either.
Panning for InfoWindows is controlled by the disableAutoPan option for each InfoWindow. You can set that option individually with InfoWindow.setOptions().
IE6 is not a supported browser for Version 3. If it works, it's a bonus.
By happenstance I needed to slightly pan my map to have all the markers show up. Besides fixing that problem, the map stopped animating on the various zooms. The effect is not exactly what one might want (the map goes blank, then the markers zoom to their spots, then the map with its new extents shows up), but it's better for what I need, and maybe it's better for you. Here's the bottom of my function that puts markers on the map:
map.fitBounds(latlngbounds);
//This minimum zoom trick I got from StackOverflow:
google.maps.event.addListenerOnce(map, 'bounds_changed', function(event){
if (this.getZoom() >= 5){
this.setZoom(5)
}
});
map.panBy(1,0);