
anmolsaini16/mapcn
Developer toolsこのページは AI により自動翻訳されています。技術的な詳細は原文をご確認ください。 原文を見る
美しいマップコンポーネント。100%無料、設定不要、コマンド設定は1つ。
概要
React用の無料かつオープンソースで、すぐに使えるカスタマイズ可能なマップコンポーネント。設定不要。コマンドセットアップは1つ。MapLibre GL上で構築され、Tailwindスタイルで、shadcn/uiとシームレスに動作します。 - 🎨 — 明暗モードに自動適応 - 🎯 — 標準で動作し、適切なデフォルト設定 - 📦 — 同じパターンとスタイリングの規則を使用 - 🗺️ — MapLibreの強力な地図機能への完全アクセス - 🧩 — シンプルで宣言的なコンポーネントで複雑な地図UIを作成 - 📍 ポップアップ、ツールチップ、ラベルを備えたリッチなマーカーシステム - 🛤️ 地図上でルートや経路を描く - 🎮 ズーム、コンパス、位置特定、フルスクリーンコントロール コーディングエージェント(Claude Code、Cursor、Codexなど)にmapcnの使い方を教えましょう: 次に地図を頼むか、アプリのどこに設置できるかを尋ねてみてください。mapcn.dev/docs/skill を参照してください。 このプロジェクトはOpenStreetMapデータに基づくCARTOベースマップを使用しています。 - : CARTO Enterpriseライセンスが必要です。価格の詳細はデモをリクエストしてください。- : CARTO助成者はベースマップ条件で無料で提供可能です。
概要(AI 翻訳)
MAPCN
React用の無料かつオープンソースで、すぐに使えるカスタマイズ可能なマップコンポーネント。 設定はゼロ。コマンド設定は1つ。MapLibre GLをベースに、Tailwindでスタイル化し、shadcn/uiとシームレスに動作します。
始め · 設置・ 構成要素
特徴
- 🎨 テーマ認識 — ライト/ダークモードに自動適応
- 🎯 ゼロ設定 — 標準設定で動作します
- 📦 shadcn/ui互換 — 同じパターンとスタイリング規則を使用しています
- 🗺️ MapLibre GL駆動 — MapLibreの強力な地図機能への完全アクセス
- 🧩 Composable — シンプルで宣言的なコンポーネントを持つ複雑なマップUIを構築する
- 📍 マーカー&ポップアップ — ポップアップ、ツールチップ、ラベルを備えたリッチマーカーシステム
- 🛤️ ルート — 地図上にルートや経路を描く
- 🎮 操作 — ズーム、コンパス、位置特定、フルスクリーンコントロール
エージェント・スキル
コーディングエージェント(Claude Code、Cursor、Codexなど)にmapcnの使い方を教えましょう:
次に地図を頼むか、アプリのどこに設置できるかを尋ねてみてください。mapcn.dev/docs/skill を参照してください。
ベースマップ利用規約
mapcnはデフォルトのスタイルと例としてOpenStreetMapのデータに基づくCARTOベースマップを使用しています。
このページは AI により自動翻訳されています。技術的な詳細は原文をご確認ください。
README
以下は原文 README の抜粋です。原文を見る。
mapcn
Free & open-source, ready-to-use, customizable map components for React. Zero config. One command setup. Built on MapLibre GL, styled with Tailwind, works seamlessly with shadcn/ui.
Get Started · Installation · Components
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
Agent Skill
Teach your coding agent (Claude Code, Cursor, Codex, …) how to use mapcn:
npx skills add AnmolSaini16/mapcn
Then ask for a map, or ask where one would fit in your app. See mapcn.dev/docs/skill.
Basemap Terms of Service
mapcn uses CARTO Basemaps powered by OpenStreetMap data for its default styles and examples.
CARTO offers free tiers for commercial and non-commercial usage, subject to monthly tile request limits and attribution requirements.
- Commercial use: Free up to 1 million tile requests per month.
- Non-commercial use: Free up to 5 million tile requests per month.
- Attribution: CARTO and OpenStreetMap attribution must remain visible.
- API keys: CARTO requires API keys for raster basemaps and may extend this requirement to vector basemaps.
For production applications, review CARTO’s terms and configure your own basemap provider or API key as needed.
mapcn is built on MapLibre and supports alternative MapLibre-compatible basemap providers.
Sponsors
mapcn is free and open source, kept going by its sponsors. Want your logo here? See mapcn.dev/sponsors.
Contributing
Contributions are welcome! Please feel free to submit a Pull Request.
- Fork the repository
- Create your feature branch (
git checkout -b feature/amazing-feature)
推奨ツール
別のキーワードを試すか、フィルタを外してください。
インストール
npx skillfish add anmolsaini16/mapcn