§19-06Maps
描画ツール (polygon/circle)
地図上に多角形や円を描いて範囲を選ぶ。
利用者が自分で範囲を指定して検索や集計を行う。配達区域や調査対象の設定など、住所では表せない範囲を扱うときに使う。
実装のポイント
クリックで頂点を追加し、ダブルクリックか始点クリックで閉じる。描いた図形は GeoJSON で保持し、頂点ドラッグでの編集と Esc での取り消しを用意する。
- 特徴
- 状態管理
- モック
- デモで使っているもの
- lucide-react
- SVG
- Pointer Events
- ソース
- map-draw.tsx