37 lines
916 B
TypeScript
37 lines
916 B
TypeScript
import react from 'react';
|
|
import { useSelector } from 'react-redux';
|
|
import { MapState } from '../../store/map';
|
|
import Tile from './tile';
|
|
|
|
import '../../theme/map.css';
|
|
import _ from 'lodash';
|
|
|
|
export const tileSize = 256;
|
|
|
|
const TiledMap: react.FC<{}> = () => {
|
|
|
|
const tilesState = useSelector((state: { map: MapState }) => state.map.tiles);
|
|
console.log(`tilesState: ${JSON.stringify(tilesState)}`);
|
|
|
|
return (
|
|
<div className='tiles'>
|
|
{_.range(tilesState.nb.y).map((iy) => (
|
|
<div key={'y' + iy} className='tilesRow'>
|
|
{_.range(tilesState.nb.y).map((ix) => (
|
|
<Tile
|
|
key={'x' + ix + 'y' + iy}
|
|
iy={iy}
|
|
ix={ix}
|
|
x={tilesState.first.x + ix}
|
|
y={tilesState.first.y + iy}
|
|
zoom={tilesState.zoom}
|
|
/>
|
|
))}
|
|
</div>
|
|
))}
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default TiledMap;
|