Skip to content

其他组件

视图与交互

组件说明
FMapCompass指北针,显示旋转角度,点击复位视图
FMapViewModeToggle2D/3D 切换按钮
FMapMultiLevelToggle单层 / 多层切换按钮
FMapPOIPopupPOI 信息弹窗(传入 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路线策略胶囊选择器

基于蜂鸟视图 Fengmap SDK 构建