航行通告（NOTAM）

NOTAM 是航行通告系统，用于发布影响飞行安全的重要信息。SDK 提供了完整的 NOTAM 功能支持，包括航线通告、区域通告的显示和详情查看。

注：如需要 C类通告，无法通过互联网对接，需要通过专线形式对接。

功能特性

航线通告：显示 NOTAM 航线通告（线要素）
区域通告：显示 NOTAM 区域通告（面要素）
交互支持：支持悬停高亮和点击查看详情
数据刷新：支持手动刷新和自动更新
样式自定义：支持自定义图层样式

基础用法

开启 NOTAM 功能

javascript

// 方式1：使用内置数据源
sdk.notam.open(true);

// 方式2：使用自定义数据源
sdk.notam.open(false);

获取并显示 NOTAM 数据

javascript

// 开启 NOTAM 图层
sdk.notam.open(false);

// 获取 NOTAM 数据
sdk.notam.getNotamData({
  pageNo: 1,
  pageSize: 100,
  onlyGeojson: true,
  typeC: true,
}).then((features) => {
  // 更新地图显示
  sdk.notam.update(features);
  
  // 开启详情弹窗（点击通告查看详情）
  sdk.notam.openNotamDetail();
});

关闭 NOTAM 功能

javascript

sdk.notam.close();

完整示例

示例1：基础使用

javascript

let sdk;

async function initMap() {
  sdk = new navMap.MapSDK({
    container: "map",
    center: [116.39, 39.9],
    zoom: 10,
  });

  sdk.on("loadComplete", () => {
    setupNOTAM();
  });
}

async function setupNOTAM() {
  // 开启 NOTAM 图层
  sdk.notam.open(false);

  // 获取 NOTAM 数据
  const features = await sdk.notam.getNotamData({
    pageNo: 1,
    pageSize: 100,
    onlyGeojson: true,
    typeC: true,
    isInternational: true,
  });

  // 更新地图显示
  sdk.notam.update(features);

  // 开启详情弹窗
  sdk.notam.openNotamDetail();
}

initMap();

示例2：自定义样式

javascript

// 自定义线图层样式（航线通告）
const lineLayerConfig = {
  paint: {
    "line-color": "#ff0000",
    "line-width": [
      "interpolate",
      ["linear"],
      ["zoom"],
      2, 1,
      4, 2,
      6, 4,
    ],
    "line-opacity": [
      "case",
      ["boolean", ["feature-state", "hover"], false],
      0.8,
      0.6,
    ],
  },
};

// 自定义面图层样式（区域通告）
const fillLayerConfig = {
  paint: {
    "fill-color": "#ff0000",
    "fill-outline-color": "rgba(255, 0, 0, 0.5)",
    "fill-opacity": [
      "case",
      ["boolean", ["feature-state", "hover"], false],
      0.5,
      0.3,
    ],
  },
};

// 开启 NOTAM 功能
sdk.notam.open(false, lineLayerConfig, fillLayerConfig);

示例3：使用图案填充

javascript

// 使用图案填充区域通告
sdk.notam.open(false, {}, {}, true);

示例4：定时刷新

javascript

// 开启 NOTAM
sdk.notam.open(false);

// 初始加载
loadNOTAMData();

// 每5分钟刷新一次
setInterval(() => {
  loadNOTAMData();
}, 5 * 60 * 1000);

async function loadNOTAMData() {
  const features = await sdk.notam.getNotamData({
    pageNo: 1,
    pageSize: 100,
  });
  sdk.notam.update(features);
}

示例5：使用 refresh 方法

javascript

// 开启 NOTAM
sdk.notam.open(false);

// 初始加载（使用默认参数）
sdk.notam.refresh();

// 定时刷新
setInterval(() => {
  sdk.notam.refresh();
}, 5 * 60 * 1000);

示例6：自定义悬停效果

javascript

sdk.notam.open(false);

// 自定义悬停回调
sdk.notam.hover((e) => {
  const feature = e.features[0];
  console.log("悬停的通告:", feature.properties);
  
  // 可以显示自定义提示
  showCustomTooltip(feature);
});

API 参考

open()

开启 NOTAM 功能。

参数：

builtin (Boolean): 是否使用内置数据源
lineLayerConfig (可选): 线图层配置（航线通告）
fillLayerConfig (可选): 面图层配置（区域通告）
isPattern (可选): 是否使用图案填充，默认 false

示例：

javascript

// 基础开启
sdk.notam.open(true);

// 自定义样式
sdk.notam.open(false, {
  paint: {
    "line-color": "#ff0000",
    "line-width": 2,
  },
}, {
  paint: {
    "fill-color": "#ff0000",
    "fill-opacity": 0.3,
  },
});

getNotamData()

获取 NOTAM 数据。

参数：

javascript

{
  pageNo: number,           // 页码，默认 1
  pageSize: number,         // 每页数量，默认 100
  onlyGeojson: boolean,     // 是否只返回 GeoJSON，默认 true
  typeC: boolean,           // 是否包含 C 类通告，默认 true
  notamOffset: string,      // 偏移量，默认 "false"
  isInternational: boolean, // 是否国际通告，默认 true
  isCompanyVersion: boolean, // 是否公司版本，默认 false
}

返回：

Promise<Array> - GeoJSON Feature 数组

示例：

javascript

const features = await sdk.notam.getNotamData({
  pageNo: 1,
  pageSize: 50,
  onlyGeojson: true,
  typeC: true,
});

update()

更新 NOTAM 数据到地图。

参数：

features (Array): GeoJSON Feature 数组

示例：

javascript

const features = await sdk.notam.getNotamData();
sdk.notam.update(features);

openNotamDetail()

开启通告详情弹窗。点击通告时会自动弹出详细信息。

示例：

javascript

sdk.notam.openNotamDetail();

refresh()

使用默认参数刷新 NOTAM 数据。

示例：

javascript

sdk.notam.refresh();

hover()

设置悬停回调函数。

参数：

callback (Function): 悬停时的回调函数

示例：

javascript

sdk.notam.hover((e) => {
  const feature = e.features[0];
  console.log("通告信息:", feature.properties);
});

close()

关闭 NOTAM 功能，清理所有图层。

示例：

javascript

sdk.notam.close();

数据格式

NOTAM Feature 格式

javascript

{
  type: "Feature",
  geometry: {
    type: "LineString" | "MultiLineString" | "Polygon" | "MultiPolygon",
    coordinates: [...],
  },
  properties: {
    notamSeries: string,    // 通告系列
    notamNoPart1: string,   // 通告编号第一部分
    notamNoPart2: string,   // 通告编号第二部分
    nof: string,            // NOF 标识
    itemA: string,          // A项（位置）
    itemB: string,          // B项（生效时间）
    itemC: string,          // C项（失效时间）
    itemD: string,          // D项（内容）
    itemE: string,          // E项（补充信息）
    // ... 更多属性
  },
}

默认参数

NOTAM 管理器提供了默认参数配置：

javascript

sdk.notam.defaultParams = {
  pageNo: 1,
  pageSize: 100,
  onlyGeojson: true,
  typeC: true,
  notamOffset: "false",
  isInternational: true,
  isCompanyVersion: false,
};

// 可以修改默认参数
sdk.notam.defaultParams.pageSize = 200;
sdk.notam.defaultParams.isInternational = false;

详情弹窗

开启 openNotamDetail() 后，点击通告会自动显示详情弹窗，包含：

A项：位置信息
B项：生效时间
C项：失效时间
D项：通告内容
E项：补充信息
通告代码：NOTAM 代码

样式配置

线图层样式（航线通告）

javascript

const lineLayerConfig = {
  paint: {
    "line-color": "#ff0000",      // 线条颜色
    "line-width": 2,              // 线条宽度
    "line-opacity": 0.6,          // 透明度
    "line-dasharray": [2, 2],     // 虚线样式（可选）
  },
};

面图层样式（区域通告）

javascript

const fillLayerConfig = {
  paint: {
    "fill-color": "#ff0000",           // 填充颜色
    "fill-outline-color": "#ff0000",   // 轮廓颜色
    "fill-opacity": 0.3,               // 填充透明度
  },
};

悬停效果

NOTAM 支持基于 feature-state 的悬停效果：

javascript

{
  paint: {
    "line-opacity": [
      "case",
      ["boolean", ["feature-state", "hover"], false],
      0.8,  // 悬停时透明度
      0.6,  // 正常透明度
    ],
  },
}

注意事项

数据源：使用内置数据源时，确保网络连接正常
数据格式：确保返回的数据是有效的 GeoJSON 格式
性能考虑：大量通告时考虑分页加载
图层顺序：NOTAM 图层默认添加在航线图层之前
详情查询：详情弹窗需要额外的 API 调用，注意网络延迟

常见问题

Q: NOTAM 数据不显示？

A: 检查以下几点：

是否调用了 open() 方法
是否调用了 update() 方法更新数据
数据格式是否正确
网络请求是否成功

Q: 如何自定义详情弹窗样式？

A: 详情弹窗使用 Popup 组件，可以通过 CSS 自定义：

css

.maplibregl-popup-content .notam-popup {
  /* 自定义样式 */
}

Q: 如何过滤特定类型的通告？

A: 在 getNotamData() 时设置参数：

javascript

const features = await sdk.notam.getNotamData({
  typeC: false, // 不包含 C 类通告
  isInternational: false, // 只显示国内通告
});

Q: 如何实现通告搜索？

A: 可以通过 API 参数实现：

javascript

// 使用 API 直接查询
const response = await sdk.notam.api.notam_detail({
  // 搜索参数
});

航行通告（NOTAM） ​

功能特性 ​

基础用法 ​

开启 NOTAM 功能 ​

获取并显示 NOTAM 数据 ​

关闭 NOTAM 功能 ​

完整示例 ​

示例1：基础使用 ​

示例2：自定义样式 ​

示例3：使用图案填充 ​

示例4：定时刷新 ​

示例5：使用 refresh 方法 ​

示例6：自定义悬停效果 ​

API 参考 ​

open() ​

getNotamData() ​

update() ​

openNotamDetail() ​

refresh() ​

hover() ​

close() ​

数据格式 ​

NOTAM Feature 格式 ​

默认参数 ​

详情弹窗 ​

样式配置 ​

线图层样式（航线通告） ​

面图层样式（区域通告） ​

悬停效果 ​

注意事项 ​

常见问题 ​

Q: NOTAM 数据不显示？ ​

Q: 如何自定义详情弹窗样式？ ​

Q: 如何过滤特定类型的通告？ ​

Q: 如何实现通告搜索？ ​

航行通告（NOTAM）

功能特性

基础用法

开启 NOTAM 功能

获取并显示 NOTAM 数据

关闭 NOTAM 功能

完整示例

示例1：基础使用

示例2：自定义样式

示例3：使用图案填充

示例4：定时刷新

示例5：使用 refresh 方法

示例6：自定义悬停效果

API 参考

open()

getNotamData()

update()

openNotamDetail()

refresh()

hover()

close()

数据格式

NOTAM Feature 格式

默认参数

详情弹窗

样式配置

线图层样式（航线通告）

面图层样式（区域通告）

悬停效果

注意事项

常见问题

Q: NOTAM 数据不显示？

Q: 如何自定义详情弹窗样式？

Q: 如何过滤特定类型的通告？

Q: 如何实现通告搜索？