-
Replace
mapKey
value in./src/App.jsx
with your own API key (get one here).const mapKey = "XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX";
-
Call
<SphereMap />
and pass in props.import { useRef } from 'react'; import { SphereMap } from './map'; <div style={{ height: '100%', width: '100%' }}> <SphereMap id='sphere-map' mapKey={mapKey} callback={onMapLoad} mapRef={mapRef} sphereRef={sphereRef} /> </div>
-
Use
mapRef
ref to interact with map, for example:mapRef.goTo({ center: { lon: 100.510847, lat: 13.743757 }, zoom: 14 });
For more example usage, see ./src/App.jsx
.