| FazBrowse GitHub Viewer | Trending | | Home |
| Tools: [Download Repo ZIP] [Original HTTPS Page] |
1 parent 9ca62b2 commit 871d26d
2 files changed
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
@@ -7,12 +7,51 @@ import { Util as CommonUtil } from '@supermapgis/iclient-common/commontypes/Util | |||
| 7 | 7 | import { ServerGeometry } from '@supermapgis/iclient-common/iServer/ServerGeometry'; | |
| 8 | 8 | import { Util } from '../core/Util'; | |
| 9 | 9 | import TileImage from 'ol/source/TileImage'; | |
| 10 | + import TileRange from 'ol/TileRange'; | ||
| 10 | 11 | import Geometry from 'ol/geom/Geometry'; | |
| 11 | 12 | import GeoJSON from 'ol/format/GeoJSON'; | |
| 12 | 13 | import * as olSize from 'ol/size'; | |
| 13 | 14 | import * as olTilegrid from 'ol/tilegrid'; | |
| 14 | 15 | import TileGrid from 'ol/tilegrid/TileGrid'; | |
| 15 | 16 | ||
| 17 | + function getOverflowTileCount(overflowTiles) { | ||
| 18 | + return Math.max(0, Math.floor(Number(overflowTiles) || 0)); | ||
| 19 | + } | ||
| 20 | + | ||
| 21 | + function wrapTileGridWithOverflow(tileGrid, overflowTiles) { | ||
| 22 | + const overflowTileCount = getOverflowTileCount(overflowTiles); | ||
| 23 | + if (!tileGrid || !overflowTileCount) { | ||
| 24 | + return tileGrid; | ||
| 25 | + } | ||
| 26 | + | ||
| 27 | + const wrappedTileGrid = Object.create(tileGrid); | ||
| 28 | + wrappedTileGrid.overflowTiles = overflowTileCount; | ||
| 29 | + wrappedTileGrid.getTileRangeForExtentAndZ = function (extent, z, tempTileRange) { | ||
| 30 | + const tileRange = tileGrid.getTileRangeForExtentAndZ(extent, z, tempTileRange); | ||
| 31 | + if (!tileRange) { | ||
| 32 | + return tileRange; | ||
| 33 | + } | ||
| 34 | + tileRange.minX -= overflowTileCount; | ||
| 35 | + tileRange.maxX += overflowTileCount; | ||
| 36 | + tileRange.minY -= overflowTileCount; | ||
| 37 | + tileRange.maxY += overflowTileCount; | ||
| 38 | + return tileRange; | ||
| 39 | + }; | ||
| 40 | + wrappedTileGrid.getFullTileRange = function (z) { | ||
| 41 | + const tileRange = tileGrid.getFullTileRange ? tileGrid.getFullTileRange(z) : null; | ||
| 42 | + if (!tileRange) { | ||
| 43 | + return tileRange; | ||
| 44 | + } | ||
| 45 | + return new TileRange( | ||
| 46 | + tileRange.minX - overflowTileCount, | ||
| 47 | + tileRange.maxX + overflowTileCount, | ||
| 48 | + tileRange.minY - overflowTileCount, | ||
| 49 | + tileRange.maxY + overflowTileCount | ||
| 50 | + ); | ||
| 51 | + }; | ||
| 52 | + return wrappedTileGrid; | ||
| 53 | + } | ||
| 54 | + | ||
| 16 | 55 | /** | |
| 17 | 56 | * @class TileSuperMapRest | |
| 18 | 57 | * @browsernamespace ol.source | |
@@ -36,6 +75,7 @@ import TileGrid from 'ol/tilegrid/TileGrid'; | |||
| 36 | 75 | * @param {string} [options.format = 'png'] - 瓦片表述类型,支持 "png" 、"webp"、"bmp" 、"jpg"、"gif" 等图片类型。 | |
| 37 | 76 | * @param {(NDVIParameter|HillshadeParameter)} [options.rasterfunction] - 栅格分析参数。 | |
| 38 | 77 | * @param {ChartSetting} [options.chartSetting] - 海图显示参数设置类,用于管理海图显示环境,包括海图的显示模式、显示类型名称、颜色模式、安全水深线等各种显示风格。 | |
| 78 | + * @param {number} [options.overflowTiles = 0] - 在当前视口范围外额外渲染的瓦片圈数。为 1 时上下左右各多请求一圈瓦片,可用于缓解符号在图层范围边缘被裁切的问题。 | ||
| 39 | 79 | * @extends {ol.source.TileImage} | |
| 40 | 80 | * @usage | |
| 41 | 81 | */ | |
@@ -46,6 +86,7 @@ export class TileSuperMapRest extends TileImage { | |||
| 46 | 86 | options.attributions || "Map Data <span>© SuperMap iServer</span> with <span>© SuperMap iClient</span>"; | |
| 47 | 87 | ||
| 48 | 88 | options.format = options.format ? options.format : 'png'; | |
| 89 | + const tileGrid = wrapTileGridWithOverflow(options.tileGrid, options.overflowTiles); | ||
| 49 | 90 | ||
| 50 | 91 | super({ | |
| 51 | 92 | attributions: options.attributions, | |
@@ -57,14 +98,15 @@ export class TileSuperMapRest extends TileImage { | |||
| 57 | 98 | reprojectionErrorThreshold: options.reprojectionErrorThreshold, | |
| 58 | 99 | state: options.state, | |
| 59 | 100 | tileClass: options.tileClass, | |
| 60 | - tileGrid: options.tileGrid, | ||
| 101 | + tileGrid: tileGrid, | ||
| 61 | 102 | tileLoadFunction: options.tileLoadFunction, | |
| 62 | 103 | tilePixelRatio: options.tilePixelRatio, | |
| 63 | 104 | tileUrlFunction: tileUrlFunction, | |
| 64 | 105 | wrapX: options.wrapX !== undefined ? options.wrapX : false, | |
| 65 | 106 | cacheEnabled: options.cacheEnabled, | |
| 66 | 107 | layersID: options.layersID | |
| 67 | 108 | }); | |
| 109 | + options.tileGrid = tileGrid; | ||
| 68 | 110 | if (options.tileProxy) { | |
| 69 | 111 | this.tileProxy = options.tileProxy; | |
| 70 | 112 | } | |
@@ -166,22 +208,28 @@ export class TileSuperMapRest extends TileImage { | |||
| 166 | 208 | function tileUrlFunction(tileCoord, pixelRatio, projection) { | |
| 167 | 209 | if (!me.tileGrid) { | |
| 168 | 210 | if (options.extent) { | |
| 169 | - me.tileGrid = TileSuperMapRest.createTileGrid(options.extent); | ||
| 211 | + me.tileGrid = wrapTileGridWithOverflow(TileSuperMapRest.createTileGrid(options.extent), options.overflowTiles); | ||
| 170 | 212 | if (me.resolutions) { | |
| 171 | 213 | me.tileGrid.resolutions = me.resolutions; | |
| 172 | 214 | } | |
| 173 | 215 | } else { | |
| 174 | 216 | if (projection.getCode() === 'EPSG:3857') { | |
| 175 | - me.tileGrid = TileSuperMapRest.createTileGrid([ | ||
| 176 | - -20037508.3427892, | ||
| 177 | - -20037508.3427892, | ||
| 178 | - 20037508.3427892, | ||
| 179 | - 20037508.3427892 | ||
| 180 | - ]); | ||
| 217 | + me.tileGrid = wrapTileGridWithOverflow( | ||
| 218 | + TileSuperMapRest.createTileGrid([ | ||
| 219 | + -20037508.3427892, | ||
| 220 | + -20037508.3427892, | ||
| 221 | + 20037508.3427892, | ||
| 222 | + 20037508.3427892 | ||
| 223 | + ]), | ||
| 224 | + options.overflowTiles | ||
| 225 | + ); | ||
| 181 | 226 | me.extent = [-20037508.3427892, -20037508.3427892, 20037508.3427892, 20037508.3427892]; | |
| 182 | 227 | } | |
| 183 | 228 | if (projection.getCode() === 'EPSG:4326') { | |
| 184 | - me.tileGrid = TileSuperMapRest.createTileGrid([-180, -90, 180, 90]); | ||
| 229 | + me.tileGrid = wrapTileGridWithOverflow( | ||
| 230 | + TileSuperMapRest.createTileGrid([-180, -90, 180, 90]), | ||
| 231 | + options.overflowTiles | ||
| 232 | + ); | ||
| 185 | 233 | me.extent = [-180, -90, 180, 90]; | |
| 186 | 234 | } | |
| 187 | 235 | } | |
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
@@ -6,6 +6,7 @@ import {getQueryValue} from '../../tool/utils'; | |||
| 6 | 6 | ||
| 7 | 7 | import Point from 'ol/geom/Point'; | |
| 8 | 8 | import * as olProj from 'ol/proj'; | |
| 9 | + import TileGrid from 'ol/tilegrid/TileGrid'; | ||
| 9 | 10 | ||
| 10 | 11 | var url = GlobeParameter.imageURL; | |
| 11 | 12 | describe('openlayers_TileSuperMapRest', () => { | |
@@ -46,6 +47,64 @@ describe('openlayers_TileSuperMapRest', () => { | |||
| 46 | 47 | expect(tileSourcetile.getTileGrid().getResolution(0)).toEqual(90.0 / 256); | |
| 47 | 48 | }); | |
| 48 | 49 | ||
| 50 | + it('tileGrid_overflowTiles_internalGrid', () => { | ||
| 51 | + var tileSource = new TileSuperMapRest({ | ||
| 52 | + url: url, | ||
| 53 | + extent: [-180, -90, 180, 90], | ||
| 54 | + overflowTiles: 1, | ||
| 55 | + prjCoordSys: { | ||
| 56 | + epsgCode: 4326 | ||
| 57 | + } | ||
| 58 | + }); | ||
| 59 | + tileSource.tileUrlFunction([0, 0, 0], 1, olProj.get('EPSG:4326')); | ||
| 60 | + const tileRange = tileSource.getTileGrid().getTileRangeForExtentAndZ([-180, -90, 180, 90], 0); | ||
| 61 | + const fullTileRange = tileSource.getTileGrid().getFullTileRange(0); | ||
| 62 | + expect(tileRange.minX).toBe(-1); | ||
| 63 | + expect(tileRange.maxX).toBe(1); | ||
| 64 | + expect(tileRange.minY).toBe(-1); | ||
| 65 | + expect(tileRange.maxY).toBe(1); | ||
| 66 | + expect(fullTileRange.minX).toBe(-1); | ||
| 67 | + expect(fullTileRange.maxX).toBe(1); | ||
| 68 | + expect(fullTileRange.minY).toBe(-1); | ||
| 69 | + expect(fullTileRange.maxY).toBe(1); | ||
| 70 | + }); | ||
| 71 | + | ||
| 72 | + it('tileGrid_overflowTiles_customTileGrid', () => { | ||
| 73 | + var tileGrid = new TileGrid({ | ||
| 74 | + extent: [-180, -90, 180, 90], | ||
| 75 | + origin: [-180, 90], | ||
| 76 | + resolutions: [180 / 256], | ||
| 77 | + tileSize: 256 | ||
| 78 | + }); | ||
| 79 | + var tileSource = new TileSuperMapRest({ | ||
| 80 | + url: url, | ||
| 81 | + tileGrid: tileGrid, | ||
| 82 | + overflowTiles: 1, | ||
| 83 | + prjCoordSys: { | ||
| 84 | + epsgCode: 4326 | ||
| 85 | + } | ||
| 86 | + }); | ||
| 87 | + const tileRange = tileSource.getTileGrid().getTileRangeForExtentAndZ([-180, -90, 180, 90], 0); | ||
| 88 | + expect(tileRange.minX).toBe(-1); | ||
| 89 | + expect(tileRange.maxX).toBe(1); | ||
| 90 | + expect(tileRange.minY).toBe(-1); | ||
| 91 | + expect(tileRange.maxY).toBe(1); | ||
| 92 | + }); | ||
| 93 | + | ||
| 94 | + it('tileUrlFunction_overflowTiles_negativeTileCoord', () => { | ||
| 95 | + var tileSource = new TileSuperMapRest({ | ||
| 96 | + url: url, | ||
| 97 | + extent: [-180, -90, 180, 90], | ||
| 98 | + overflowTiles: 1, | ||
| 99 | + prjCoordSys: { | ||
| 100 | + epsgCode: 4326 | ||
| 101 | + } | ||
| 102 | + }); | ||
| 103 | + var tileUrl = tileSource.tileUrlFunction([0, -1, -1], 1, olProj.get('EPSG:4326')); | ||
| 104 | + expect(tileUrl).toContain('&x=-1'); | ||
| 105 | + expect(tileUrl).toContain('&y=-1'); | ||
| 106 | + }); | ||
| 107 | + | ||
| 49 | 108 | it('tileUrlFunction_tilePoxy', () => { | |
| 50 | 109 | var tileOptions = { | |
| 51 | 110 | url: url, | |
| Back | FazBrowse Home | New Git URL |
0 commit comments