Adding the notion of TileFactory
This commit is contained in:
parent
cf50675077
commit
a5dc279e4e
|
@ -1,5 +1,8 @@
|
|||
import { render, screen } from '@testing-library/react';
|
||||
import TiledLayer from './TiledLayer';
|
||||
import { TileFactory } from './types';
|
||||
|
||||
const fakeTileFactory: TileFactory = (keyObject) => <></>;
|
||||
|
||||
describe('The TiledLayer component ', () => {
|
||||
test('exposes the tiles needed per its viewport', () => {
|
||||
|
@ -8,6 +11,7 @@ describe('The TiledLayer component ', () => {
|
|||
<TiledLayer
|
||||
keyObject={{ provider: 'osm', zoomLevel: 10, x: 5, y: 8 }}
|
||||
viewPort={{ topLeft: { x: 1, y: 2 }, bottomRight: { x: 3, y: 2 } }}
|
||||
tileFactory={fakeTileFactory}
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
|
@ -37,6 +41,7 @@ describe('The TiledLayer component ', () => {
|
|||
<TiledLayer
|
||||
keyObject={{ provider: 'osm', zoomLevel: 10, x: 5, y: 8 }}
|
||||
viewPort={{ topLeft: { x: 1, y: 2 }, bottomRight: { x: 3, y: 2 } }}
|
||||
tileFactory={fakeTileFactory}
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
|
@ -45,6 +50,7 @@ describe('The TiledLayer component ', () => {
|
|||
<TiledLayer
|
||||
keyObject={{ provider: 'osm', zoomLevel: 10, x: 5, y: 8 }}
|
||||
viewPort={{ topLeft: { x: 5, y: 0 }, bottomRight: { x: 5, y: 2 } }}
|
||||
tileFactory={fakeTileFactory}
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import react, { useRef } from 'react';
|
||||
import { range } from 'lodash';
|
||||
|
||||
import { Rectangle, TileKeyObject } from './types';
|
||||
import { Rectangle, TileFactory, TileKeyObject } from './types';
|
||||
import tileUri from './uris';
|
||||
|
||||
export interface TiledLayerProperties {
|
||||
|
@ -9,6 +9,8 @@ export interface TiledLayerProperties {
|
|||
keyObject: TileKeyObject;
|
||||
/** The current viewport expressed in tiles coordinates */
|
||||
viewPort: Rectangle;
|
||||
/** The factory to create tiles */
|
||||
tileFactory: TileFactory;
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
@ -29,3 +29,9 @@ export interface Rectangle {
|
|||
topLeft: Point;
|
||||
bottomRight: Point;
|
||||
}
|
||||
|
||||
/**
|
||||
* A function which creates tiles
|
||||
* @param keyObject - the {@link TileKeyObject} identifying the tile.
|
||||
*/
|
||||
export type TileFactory = (keyObject: TileKeyObject) => any;
|
||||
|
|
Loading…
Reference in New Issue