首页 / OpenLayers / 使用示例
高分辨率 XYZ
同一区域分别用 1 倍与 2 倍瓦片渲染，勾选开关即可对比标注与网格的清晰度。
源码与运行效果
说明
ol.source.XYZ 的 tilePixelRatio: 2 告知渲染器：瓦片图片的实际像素是 CSS 像素的两倍。示例的两个瓦片源都只绘制半透明网格与数字，底层 OSM 提供地理背景；2 倍源用 512 像素画布生成同样的内容，因此在屏幕上文字和线条更细腻。
| 操作 | 结果 |
|---|---|
| 勾选「2 倍瓦片」 | 网格线更细，数字边缘更清晰 |
| 取消勾选 | 回到 1 倍瓦片，文字出现明显锯齿 |
| 缩放到街道级 | 两种瓦片的差异在高分屏上更明显 |
高分辨率瓦片会把显存占用提高到约 4 倍；只在关键图层启用，并确保服务端提供对应 @2x 资源。