cartodb/Leaflet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Turns out the android browser has this issue too.

Browse Source 
Change the hack to just use top/left if chrome is being used, otherwise use transform.
Hopefully chrome fixes their issue so we can use transform everywhere instead.
This commit is contained in:
danzel 2012-07-17 11:58:04 +12:00
parent d6b0b02c3f
commit b663c7f442
3 changed files with 10 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
debug/hacks/jitter.html
View File

@ -20,7 +20,7 @@
<input id="textField" name="textField" type="text" value=""> <input id="textField" name="textField" type="text" value="">
</fieldset> </fieldset>
</form> </form>
Bug tested to occur on: Safari on Mac (Tested in 5.1.7), iPad/iPhone 5.1.1. Hack is in L.Browser.safari and TileLayer._addTile Bug tested to occur on: Safari on Mac (Tested in 5.1.7), iPad/iPhone 5.1.1., Android 4 Browser. Hack is in L.Browser.chrome and TileLayer._addTile
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
@ -31,8 +31,8 @@
key: 'BC9A493B41014CAABB98F0471D759707' key: 'BC9A493B41014CAABB98F0471D759707'
}); });
//Undo the hack fix //Disable the hack fix
L.Browser.safari = false; L.Browser.chrome = true;
var map = L.map('map') var map = L.map('map')
.setView([50.5, 30.51], 15) .setView([50.5, 30.51], 15)

6
src/core/Browser.js
View File

@ -4,8 +4,8 @@
ie6 = ie && !window.XMLHttpRequest, ie6 = ie && !window.XMLHttpRequest,
webkit = ua.indexOf("webkit") !== -1, webkit = ua.indexOf("webkit") !== -1,
gecko = ua.indexOf("gecko") !== -1, gecko = ua.indexOf("gecko") !== -1,
//Terrible browser detection to work around a safari / iOS browser bug. See TileLayer._addTile and debug/hacks/jitter.html //Terrible browser detection to work around a safari / iOS / android browser bug. See TileLayer._addTile and debug/hacks/jitter.html
safari = (ua.indexOf("safari") !== -1 || ua.indexOf("iphone") !== -1 || ua.indexOf("ipad") !== -1) && ua.indexOf("applewebkit") !== -1 && ua.indexOf("chrome") === -1, chrome = ua.indexOf("chrome") !== -1,
opera = window.opera, opera = window.opera,
android = ua.indexOf("android") !== -1, android = ua.indexOf("android") !== -1,
android23 = ua.search("android [23]") !== -1, android23 = ua.search("android [23]") !== -1,
@ -53,7 +53,7 @@
android: android, android: android,
android23: android23, android23: android23,
safari: safari, chrome: chrome,
ie3d: ie3d, ie3d: ie3d,
webkit3d: webkit3d, webkit3d: webkit3d,

6
src/layer/tile/TileLayer.js
View File

@ -315,8 +315,10 @@ L.TileLayer = L.Class.extend({
// get unused tile - or create a new tile // get unused tile - or create a new tile
var tile = this._getTile(); var tile = this._getTile();
//Chrome 20 layouts much faster with top/left (Verify with timeline, frames), Safari 5.1.7 and iOS 5.1.1 have display issues with top/left and requires transform instead. (Other browsers don't currently care) //Chrome 20 layouts much faster with top/left (Verify with timeline, frames),
L.DomUtil.setPosition(tile, tilePos, !L.Browser.safari); //Safari 5.1.7, iOS 5.1.1, android browser (4.0) have display issues with top/left and requires transform instead. (Other browsers don't currently care)
//See debug/hacks/jitter.html for an example
L.DomUtil.setPosition(tile, tilePos, L.Browser.chrome);
this._tiles[key] = tile; this._tiles[key] = tile;