首页 / OpenLayers / 使用示例
`r`n 底图主题切换
主题底图的差异主要来自瓦片内容，请求地址里同时写着主题名与 Key。
`r`n
源码与运行效果
说明
示例把主题名与 Key 拼进地址模板 https://tiles.stadiamaps.com/tiles/{theme}/{z}/{x}/{y}.png?api_key={key}，顶部实时显示拼装结果，Key 部分打码。没有 Key 时瓦片请求会失败，因此底图仍用 OSM，并用 CSS 滤镜近似对应主题的明暗与饱和度。填入 Key 后把 ol.source.XYZ 指向该模板即可换成真实服务。
| 操作 | 结果 |
|---|---|
| 切换主题 | 滤镜改变底图观感，地址模板同步更新 |
| 填写 Key | 地址模板补上参数，真实服务可直接替换 |
| 缩放地图 | 滤镜只影响画面，不影响瓦片请求 |
要点
- 地址模板中的
{z}、{x}、{y}由 XYZ 源自动填充。 - Key 属于凭据，展示时应打码，不要写进静态页面。
切换服务商前先核对瓦片协议与版权要求，地址能通不代表授权允许。