sandbox/map/src/components/layer.tsx

27 lines
685 B
TypeScript

import react from 'react';
import { ViewportState } from './viewport';
import '../theme/layer.css';
const Layer: react.FC<{
viewportState: ViewportState;
children?: JSX.Element;
}> = (props: { viewportState: ViewportState; children?: JSX.Element }) => {
const { children: children, ...argProps } = props;
console.log(`--- Rendering layer, props: ${JSON.stringify(argProps)} ---`);
return (
<div
className='background'
style={{
transform: `translate(${props.viewportState.translation.x}px, ${props.viewportState.translation.y}px) scale(${props.viewportState.scale})`,
}}
>
{props.children}
</div>
);
};
export default Layer;