首页 / OpenLayers / 使用示例
`r`n SVG 图层
SVG 是矢量图，作为静态图片铺到地图范围后，放大不会出现锯齿。
`r`n
源码与运行效果
说明
示例用字符串拼出一段 600×400 的 SVG，含矩形、圆、路径与文字，其中矩形用 pattern 做斜线填充。整段源码经 encodeURIComponent 编码后拼成 data:image/svg+xml 地址，交给 ImageStatic，范围由两个角点的 fromLonLat 结果给出。不透明度与显隐可直接在图层上控制。
| 操作 | 结果 |
|---|---|
| 放大到街区级别 | 图形边缘依然平滑，文字清晰 |
| 取消勾选「SVG 图层」 | 图形隐藏，只剩底图 |
| 调整不透明度 | 图形整体变淡 |
要点
- data URL 必须编码，否则井号与尖括号会被截断。
- SVG 的
viewBox决定坐标系，与地图范围无关。
复杂 SVG 直接内联到页面再取 outerHTML 会更易维护，也方便配色变量复用。