Fix preview flickering on iOS devices (#542)

* v3.6.2 Keep one <img /> per tile, transition from preview, to full by settings "src" attr

package.json

@@ -1,6 +1,6 @@
 {
   "name": "2gis-maps",
-  "version": "3.6.1",
+  "version": "3.6.2",
   "description": "Interactive 2GIS maps API, based on Leaflet",
   "license": "SEE LICENSE IN FILE",
   "keywords": [

src/DGCustomization/src/DGMobileImprove.js

@@ -368,7 +368,7 @@ L.MobileTileLayer = L.TileLayer.extend({
         var needPreview = this._needPreviewTile(wrapCoords);
 
         var url = needPreview ? this._previewUrl : this._url;
-        var tile = this.createTile(wrapCoords, L.bind(this._tileReady, this, coords), url);
+        var tile = this.createTile(wrapCoords, L.bind(needPreview ? this._previewReady : this._tileReady, this, coords), url);
 
         this._initTile(tile);
 
@@ -391,6 +391,21 @@ L.MobileTileLayer = L.TileLayer.extend({
         });
     },
 
+    _previewReady: function(coords, err, tile) {
+        if (!this._map) { return; }
+
+        var key = this._tileCoordsToKey(coords);
+
+        tile = this._tiles[key];
+        if (!tile) { return; }
+
+
+        tile.el.onload = L.bind(this._tileReady, this, coords, err, tile);
+        tile.el.onerror = L.bind(this._tileReady, this, coords, err, tile);
+        tile.el.src = this.getTileUrl(coords, this._url);
+    },
+
+
     /**
      * Убран fadeAnimated и класс leaflet-tile-loaded
      */
@@ -412,23 +427,6 @@ L.MobileTileLayer = L.TileLayer.extend({
         tile = this._tiles[key];
         if (!tile) { return; }
 
-        // Если у тайла уже есть оригинальная (не пожатая) картинка,
-        // то заменим превью на нее
-        if (tile.originalEl && tile.el.parentNode) {
-            tile.el.parentNode.replaceChild(tile.originalEl, tile.el);
-            tile.el = tile.originalEl;
-
-            tile.originalEl = null;
-            tile.preview = false;
-
-        // Если у тайла есть только превью, то добавим его на карту
-        // И начнем грузить оригинальный
-        } else if (tile.preview) {
-            tile.originalEl = this.createTile(this._wrapCoords(coords), L.bind(this._tileReady, this, coords), this._url);
-            this._initTile(tile.originalEl);
-            L.DomUtil.setPosition(tile.originalEl, this._getTilePos(coords));
-        }
-
         tile.loaded = +new Date();
         tile.active = true;
         this._pruneTiles();