While using mapbox maps, When we move the map, zoom-in and zoom-out to locations, after a certain point of time, the new images of map stop loading.
When i checked on console, the new tiles server requests stay in pending state.
This also happens with the map in the sample map at https://www.mapbox.com/mapbox.js/example/v1.0.0/
Just keep using it for a while and make rapid zoom-in and zoom-outs in the map.
Note that this is not an internet bandwidth issue, and i am also using the paid version of mapbox.
My configuration is:
Browser: Chrome Version 45.0.2454.85 m
OS: Windows 8 Pro
Mapbox version: 2.2.2
I could not reproduce this, however I had a similar issues with the tiles not loading. It turned out to be due to a div I had covering part of the map area. It seems like mapbox can detect if there is an object over the map area and will not load the tiles.
Just an idea, hope it helps.
Just diagnosed this in our office. Updating Chrome to the most recent version (48) OR disabling Tampermonkey solved the problem. As per https://github.com/Leaflet/Leaflet/issues/3198, other extensions may also trigger the same Chrome bug.
Related
I am using Mapbox GL JS with a meteor+blaze application. When the user drags the map it starts blinking and sometimes it blinks even without dragging the map.
I have used meteor.autorun to insert the dynamic marker into map based on category selection.
Please guide me, how I can fix it.
It sounds like you may be describing https://github.com/mapbox/mapbox-gl-js/issues/5490, a GPU-specific bug that was patched in the most recent release (v0.42.1). Does your issue persist if you upgrade to that version?
I am trying to build a map-based web app using mapbox and leaflet.js.
I am loading around 300 markers into a featureLayer from a geoJSON file. This seems to work beautifully in every browser except internet explorer, which freezes for a good 10 seconds or so every time markers are loaded or filtered using featureLayer.setFilter. I have uploaded a demo of this here.
Locking at the IE performance analysis the culprit seems to be the 'addDoubleTapListener'. This seems to be a known issue (https://github.com/Leaflet/Leaflet/issues/4357), and the solutions suggest rolling back to leaflet 0.7.5, or using the 0.7.7.1 branch (which has a fix that reverts touch detection). I have tried both, and neither seem to have any effect on the issue. Upgrading to the leaflet 1.0.0-beta is also suggested, but this doesn't seem to be compatible with the current mapbox...
Any help with overcoming this issue would be much appreciated.
Ok the solution I found was to remove the following lines from leaflet-src.js 0.7.7.1:
if (L.Browser.touch && (type === 'dblclick') && this.addDoubleTapListener) {
this.addDoubleTapListener(obj, handler, id);
}
IE now loads the markers lightning fast and all of the functions appear to still be working in all the devices I tried. Not an ideal solution, but will serve as a stop-gap solution until Mapbox supports Leaflet 1.0.0.
To make things easier, here is a JSFiddle of what I have.
TRY
In FireFox (version 35.0.1) pan the map. Click and hold anywhere on the map, and move it about quickly left and right. Panning movement should be quick and smooth.
Now try the same in Chrome and you'll see that it is not as smooth! It is a bit jerky/laggy. I find it laggy in the latest version of IE and Opera too.
By the way, if you comment out this style block, then behaviour all of a sudden smooths out and stops being laggy! You won't get a nice map of course.
#map path {
fill: #C9DCC9;
stroke: #066860;
}
SO WHAT?
First of all I would appreciate it if someone can confirm this behaviour on their PCs. I am on Windows 8.1 with all latest updates.
And then, why isn't this behaviour happening on other maps done with D3? This one for example behaves smoothly! Is it to do with the complexity of the polygons?
To fix this, I simplifed the paths of the map. I used the -simplification function on TopoJson.
After the simplification of the paths, the map panning and zooming was super smooth in Chrome, Firefox, Opera and IE 11.
TopoJson is a node package, so you would need to install node and a lot of other dependencies for TopoJson to get it working on windows. If you're lucky it'll work for you on Windows.
I was unlucky so I went and created a Virtual Machine running Ubuntu and in there, the node setup was soo much easier, I managed to do what I wanted in 5 minutes. Compared to days attempting to get this working on Windows.
Anyways, hope this helps. :)
So I have a Ruby on Rails app that uses Leaflet JS to display a rather large map file overlaid with various layers of boxes, markers, paths, etc. However, if I load the map through IE 11, once I change zoom levels from the initial value everything is removed, the map stops loading, and I can no longer change zoom levels. I do not believe it is a problem with my code for several reasons, mainly the facts that:
Everything works in Firefox and Chrome
Map works on IE version 9
Code produces no error messages in console or anywhere else
So I have to admit I'm at a near-complete loss as to the cause of this error. I've pulled the latest stable leaflet release but it didn't change anything. I'm hoping someone has a suggestion that might help out.
I've created a map page using OpenLayers. The user can select a specific thematic overlay (noise levels) by period, noise source and year.
I wanted to allow the user to choose a base (or background) layer: one of two (public) OpenStreetMap layers, the Google base layers, or one of Yahoo! Maps’ layers.
I originally wanted to provide Bing maps (Virtual Earth) as well, but since those use a different projection, I can’t use them in combination with my overlays (custom-served tiles).
It all works fine in almost all browsers: Firefox, Chrome, Safari, and Opera (if you don’t click too much). But when using Internet Explorer (versions 7 and 8), selecting one of the Google Maps layers results in a blank background.
I’ve tested with Fiddler, and the tiles aren’t even retrieved.
I’m running into a wall here.
Has anybody run into this problem before (and preferably: solved it)? Or does someone have an idea what could be going wrong?
Edit: The site is located at http://software.dgmr.nl/geluidskaart/.
See #7 of this issue, it seems to fix the problem.
Not sure, if it is directly related to your issue though.
Try removing "blank.gif" from the dark theme image folder.
It also made it work in IE.
I have had an issue before with Google base layers when using an overview window, and a mix of Yahoo and Google layers.
Try removing the Yahoo layers to see if this is the issue (or the overview map).
I believe there could be a clash of variable names with this combination of JavaScript libraries.
There is an error reported in IE in the ymapapi file:
this.MP is null or not an object
Edit: There is a problem with your CSS. The Google layer / images are loading without problems, but you have a "background: url(http://js.mapbox.com/theme/dark/blank.gif);" attribute on your Google layer. I removed this and the Google maps were displayed without problems.
This appears in your OpenLayers.Layer.Google_95_EventPane DIV.