mapcn-react-native

Beautiful maps, made simple.

Free & open source map components. Zero config, one command setup.
Built on MapLibre React Native, styled with Nativewind, works seamlessly with React Native Reusables.

Get Started • Installation • Examples

---

Features

• 🎨 Theme-aware — Automatically adapts to light/dark mode
• 🎯 Zero config — Works out of the box with sensible defaults
• 📦 shadcn/ui compatible — Uses the same patterns and styling conventions
• 🗺️ MapLibre GL powered — Full access to MapLibre's powerful mapping capabilities
• 🧩 Composable — Build complex map UIs with simple, declarative components
• 📍 Markers & Popups — Rich marker system with popups, tooltips, and labels
• 🛤️ Routes — Draw routes and paths on your maps
• 🎮 Controls — Zoom, compass, locate, and fullscreen controls

Basemap Options

Alternatively use the mapbox version

This project provides two map component options:

Option 1: Carto Basemaps (Default)

Import from @/components/ui/map to use CARTO Basemaps.

• Commercial use: Requires a CARTO Enterprise license. Request a demo for pricing details.
• Non-commercial use: Free for CARTO grantees under their basemap terms.

Option 2: Maptiler (Cheaper Alternative for commercial use)

Import from @/components/ui/map-maptiler to use Maptiler tiles.

Setup:

1. Get a free access token at https://cloud.maptiler.com/account/keys/
2. Create a .env file in the project root:

   EXPO_PUBLIC_MAPTILER_API_KEY=your_token_here

3. Update your imports:

   import { Map } from "@/components/ui/map-maptiler";

Pricing:

• Free 100k requests
• Pricing details: https://www.maptiler.com/cloud/pricing/

Both components have identical APIs and props. Choose based on your licensing and budget needs.

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

1. Fork the repository
2. Create your feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add some amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

Inspired by mapcn

License

MIT License - see the LICENSE file for details.