FMapHighlighter 高亮

FMapHighlighter 统一管理地图 model 的高亮状态。它不依赖 SDK 内置的 pickFilter 高亮，而是通过 map.getNodes() 定位 model 节点后调用 node.setColor() / node.resetColor() 上色与复位，点击与搜索结果共用同一个高亮入口。

基本用法

import { FMap, FMapHighlighter, FMapModel } from '@indoor-map/fmap-js';

const fmap = new FMap({ /* ... */ });
await fmap.init();

const highlighter = new FMapHighlighter(fmap);

// 可选：禁用 SDK 内置拾取高亮，避免两套高亮叠加
highlighter.disableSdkHighlight();

高亮 / 取消高亮

highlight() 接受 FMapModel 或搜索结果项（SearchResultItem），内部会自动将搜索结果解析为 FMapModel：

// 高亮点击到的 model（单选语义：自动清掉上一个高亮）
// SDK 原生点击事件包含 targets 数组，点击穿透可能有多个要素
fmap.on('click', (event) => {
  const { targets = [] } = event as { targets?: Array<{ FID?: string; name?: string; type?: number }> };
  const modelTarget = targets.find((t) => t.FID);
  if (modelTarget) {
    highlighter.highlight(FMapModel.resolve(fmap, modelTarget));
  }
});

// 高亮搜索结果，并自定义颜色
const results = await search.searchByName('星巴克');
highlighter.highlight(results[0], { color: '#ff7949' });

// 取消某个高亮（传 model 或 FID 均可）
highlighter.unhighlight(results[0]);
highlighter.unhighlight('123456');

// 清空所有高亮
highlighter.clear();

批量高亮

highlighter.highlightMany(results, { color: '#1890ff' });

状态查询

highlighter.isHighlighted(fid);      // 该 FID 是否处于高亮
highlighter.getHighlightedFIDs();    // 所有高亮中的 FID 列表
highlighter.highlightedCount;        // 当前高亮数量

API

方法 / 属性	说明
`disableSdkHighlight()`	禁用 SDK 内置拾取高亮（pickFilter 恒返回 false）
`highlight(model, options?)`	高亮单个 model（`FMapModel` 或 `SearchResultItem`），先清空旧高亮
`highlightMany(models, options?)`	批量高亮
`unhighlight(modelOrFid)`	取消单个高亮，接受 model 对象或 FID 字符串
`clear()`	清空所有高亮并复位颜色
`isHighlighted(fid)`	查询 FID 是否高亮中
`getHighlightedFIDs()`	返回高亮中的 FID 数组
`highlightedCount`	当前高亮数量（getter）

HighlightOptions：

interface HighlightOptions {
  /** 高亮颜色，默认 #ff7949 */
  color?: string;
}

注意事项

节点上色依赖 model 的 eid，缺少 eid 的数据无法定位节点，高亮会静默跳过。
highlight() 是单选语义（每次先 clear()），需要同时保留多个高亮时使用 highlightMany()。

FMapHighlighter 高亮 ​

基本用法 ​

高亮 / 取消高亮 ​

批量高亮 ​

状态查询 ​

API ​

注意事项 ​

相关示例 ​