其他组件
视图与交互
| 组件 | 说明 |
|---|---|
FMapCompass | 指北针,显示旋转角度,点击复位视图 |
FMapViewModeToggle | 2D/3D 切换按钮 |
FMapMultiLevelToggle | 单层 / 多层切换按钮 |
FMapPOIPopup | POI 信息弹窗(传入 FMapModel),支持导航到此 |
tsx
<FMapCompass position="top-right" />
<FMapViewModeToggle />
<FMapMultiLevelToggle />
<FMapPOIPopup
poi={selectedPOI}
currentFloorName="F1"
onClose={() => setSelectedPOI(null)}
onNavigate={(poi) => startNavigation(poi)}
/>分类与结果
| 组件 | 说明 |
|---|---|
FMapCategory | 分类标签栏,点击分类搜索并高亮 POI,支持多选 |
FMapCategoryGrid | 分类快捷入口网格(加油站、充电站、美食等),内置 DEFAULT_NAV_CATEGORIES |
FMapSearchResults | 搜索结果列表,支持自定义渲染 |
tsx
<FMapCategory
categories={DEFAULT_MALL_CATEGORIES}
multiple
onCategoryClick={(category, results) => console.log(results)}
/>
<FMapCategoryGrid
categories={DEFAULT_NAV_CATEGORIES}
columns={5}
onCategoryClick={(item) => search(item.keyword)}
/>楼层与导航补充
| 组件 | 说明 |
|---|---|
FMapFloorButtons | 简洁楼层按钮组 |
FMapNavigationHeader | 顶部起终点输入条(配合导航面板使用) |
FMapWaypointInput | 单个途经点输入框(支持拖拽、删除) |
FMapRouteDetail | 路线步骤详情面板 |
FMapRouteStrategySelector | 路线策略胶囊选择器 |