oz-map-tool-menu v0.2.5

react oz-map tool menu module

install

install using npm install oz-map-tool-menu

usage

in a react app, use the ToolMenu component:

1. import

import { ToolMenu } from "oz-map-tool-menu"
import { Map } from "oz-map";

2. for fonts

import 'semantic-ui-css/semantic.min.css'

or

<link async
    rel="stylesheet"
    href="https://cdn.jsdelivr.net/npm/semantic-ui@2/dist/semantic.min.css"
  />

3. component

let mapRef = React.createRef()

return <div>
    <Map ref={mapRef}
        view={{
            projection: 'EPSG:3857',
            center: [4000000, 4700000],
            zoom: 8,
        }}
        handleInfo={(event) => {

            alert(event.feature.getGeometry().getCoordinates());
        }}
    />
    <ToolMenu map={mapRef} />
</div>

4. also remove

<React.StrictMode>

css

#tool-menu {
    position: absolute;
    top: 0;
    right: 150px;
}