Skip to content

文档与示例

本文档涵盖 Leaflet 的文档生成系统和交互式示例框架。这包括基于 Jekyll 的文档站点、API 参考生成、带嵌入式示例的教程系统,以及支持 Leaflet 发布间版本化文档的基础设施。

关于插件生态系统和社区贡献扩展的信息,请参阅 插件系统。关于生成分布式库文件的构建系统详细信息,请参阅 构建与开发

文档架构

Leaflet 的文档系统建立在 Jekyll 上,Jekyll 是一个静态站点生成器,将 Markdown 文件和模板转换为完整的文档网站。系统支持多种内容类型,包括 API 参考、教程和交互式示例。

SVG
100%

主布局模板 docs/_layouts/v2.html 为所有文档页面提供通用结构,包括导航、页眉和页脚元素。它通过 CDN 集成 Leaflet 的 CSS 和 JavaScript,带有可配置的完整性哈希以确保安全。

教程和示例框架

示例系统使用双布局方法,教程包含解释性内容和嵌入式交互式演示。每个示例由一个教程页面和一个或多个包含工作代码的框架页面组成。

SVG
100%

tutorial_frame 布局在 docs/_layouts/tutorial_frame.html1-46 中创建为嵌入优化的最小 HTML 页面。这些框架通过 importmap 配置自动包含 Leaflet CSS 和 JavaScript,允许示例使用现代 ES 模块语法。

关键示例包括:

API 参考系统

docs/reference.html1-975 中的综合 API 参考为所有 Leaflet 类、方法和选项提供详细文档。参考使用结构化格式,以表格形式呈现构造函数、选项、事件和方法。

SVG
100%

参考文档组织成逻辑分组:

  • 核心类:Map、Layer 层次结构、Controls
  • 几何类型:LatLng、Point、Bounds
  • UI 组件:Markers、Popups、Tooltips
  • 工具系统:DomUtil、DomEvent、Browser 检测

每个类部分包括使用示例、构造函数签名、配置选项、可用事件和方法文档及返回类型。

模块集成和 CDN 分发

文档系统通过 importmap 配置与 Leaflet 的现代 ES 模块分发集成。这允许示例使用命名导入,同时保持与 CDN 交付的兼容性。

SVG
100%

docs/_config.yml8-17 中的配置定义当前 Leaflet 版本和主模块及全局脚本版本对应的完整性哈希。这确保安全的 CDN 集成,同时支持现代 ES 模块和旧版全局脚本使用。

来自教程框架的示例 importmap 配置:

{
  "imports": {
    "leaflet": "https://cdn.jsdelivr.net/npm/leaflet@2.0.0-alpha.1/dist/leaflet.js"
  },
  "integrity": {
    "https://cdn.jsdelivr.net/npm/leaflet@2.0.0-alpha.1/dist/leaflet.js": "sha256-..."
  }
}

版本管理和历史参考

文档系统通过归档快照和版本特定的参考页面维护对多个 Leaflet 版本的引用。docs/reference-versions.html1-24 页面提供对历史 API 文档的访问。

SVG
100%

RELEASE.md15-25 中记录的发布流程包括在发布新版本前归档当前文档的步骤。这确保用户可以访问他们正在使用的特定 Leaflet 版本的文档。

迁移文档,如 docs/_posts/2025-05-18-leaflet-2.0.0-alpha.md1-208 提供详细的升级指南,包括代码转换示例和主要版本过渡的兼容性考虑。

调试和开发示例

文档系统在 [debug/] 目录中包含调试示例,作为开发工具和高级使用演示。这些示例使用源代码分发进行测试和调试。

SVG
100%

debug/map/popup.html1-84 这样的调试示例演示动态弹窗内容生成、图层 ID 管理和复杂交互模式等高级功能。这些示例使用 importmap 配置加载未压缩的源代码版本以便调试。