> ## Documentation Index
> Fetch the complete documentation index at: https://rodrito.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.
# HereMap
> Main map container component with context provider
# HereMap
The `HereMap` component is the main container for HERE Maps. It provides the map context to all child components through React Context.
## Props
Your HERE Maps API key. Get one at [developer.here.com](https://developer.here.com/)
Map initialization options
Initial center coordinates of the map. Defaults to `{ lat: 0, lng: 0 }`
Initial zoom level (0-22). Defaults to `10`
Rendering engine type. Defaults to `'P2D'`
Map style/theme. Defaults to `"vector.normal.map"`
Available styles:
* `vector.normal.map` - Standard vector map
* `raster.satellite.map` - Satellite imagery
* `raster.terrain.map` - Terrain view
* `raster.normal.mapnight` - Night mode
Child components (Markers, Polylines, Controls, etc.)
## Basic Usage
```tsx theme={null}
import { HereMap } from '@rodrito/react-here-maps';
function App() {
return (
);
}
```
The container must have a defined height for the map to render properly.
## Map Styles
```tsx theme={null}
```
```tsx theme={null}
```
```tsx theme={null}
```
```tsx theme={null}
```
## With Child Components
```tsx theme={null}
import { HereMap, Marker, Polyline, ZoomControl, ScaleBar } from '@rodrito/react-here-maps';
function CompleteMap() {
return (
);
}
```
## Context Provider
The `HereMap` component provides a context that can be accessed by child components:
```tsx theme={null}
import { useMapContext } from '@rodrito/react-here-maps';
function CustomComponent() {
const { map, platform, ui, behavior } = useMapContext();
// Access map instance and other HERE Maps objects
// ...
return null;
}
```
## Engine Types
2D rendering engine. Better performance on older devices.
WebGL rendering engine. Better performance with complex visualizations.
```tsx theme={null}
// Use WebGL engine
```
## See Also
Learn about the context system
Add markers to the map
Add interactive controls