TileLayer add options.bufferPixel for custom tile buffer size (#2078)

Author: deyihu

src/layer/tile/TileLayer.js

@@ -86,6 +86,7 @@ class TileHashset {
  * @property {String}              [options.token=null]       - token to replace {token} in template http://foo/bar/{z}/{x}/{y}?token={token}
  * @property {Object}              [options.fetchOptions=object]       - fetch params,such as fetchOptions: { 'headers': { 'accept': '' } }, about accept value more info https://developer.mozilla.org/en-US/docs/Web/HTTP/Content_negotiation/List_of_default_Accept_values
  * @property {Boolean}             [options.awareOfTerrain=true]       - if the tile layer is aware of terrain.
+ * @property {Number}             [options.bufferPixel=0.5]       - tile buffer size,the unit is pixel
  * @memberOf TileLayer
  * @instance
  */
@@ -146,7 +147,8 @@ const options = {
     'tileStackStartDepth': 7,
     'tileStackDepth': 3,
 
-    'awareOfTerrain': true
+    'awareOfTerrain': true,
+    'bufferPixel': 0.5
 };
 
 const URL_PATTERN = /\{ *([\w_]+) *\}/g;

src/renderer/layer/tilelayer/TileLayerCanvasRenderer.js

@@ -695,14 +695,16 @@ class TileLayerCanvasRenderer extends CanvasRenderer {
             y = cp.y;
         let w = tileInfo.extent2d.xmax - tileInfo.extent2d.xmin;
         let h = tileInfo.extent2d.ymax - tileInfo.extent2d.ymin;
+        const layer = this.layer;
+        const bufferPixel = (layer ? layer.options.bufferPixel : 0);
         if (transformed) {
             ctx.save();
             ctx.translate(x, y);
             if (bearing) {
                 ctx.rotate(-bearing * Math.PI / 180);
             }
-            w += 0.5;
-            h += 0.5;
+            w += bufferPixel;
+            h += bufferPixel;
             const res = map._getResolution();
             if (res !== tileInfo.res) {
                 const scale = tileInfo.res / res;