Showing
1 changed file
with
29 additions
and
2 deletions
| 1 | /* | 1 | /* |
| 2 | * @Date: 2025-01-22 11:45:30 | 2 | * @Date: 2025-01-22 11:45:30 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2025-02-24 13:21:58 | 4 | + * @LastEditTime: 2025-02-24 17:15:58 |
| 5 | * @FilePath: /map-demo/src/utils/TileCutter.js | 5 | * @FilePath: /map-demo/src/utils/TileCutter.js |
| 6 | * @Description: 文件描述 | 6 | * @Description: 文件描述 |
| 7 | */ | 7 | */ |
| ... | @@ -120,12 +120,39 @@ function sliceImageToTiles(image, bounds, zoomLevel) { | ... | @@ -120,12 +120,39 @@ function sliceImageToTiles(image, bounds, zoomLevel) { |
| 120 | } | 120 | } |
| 121 | } | 121 | } |
| 122 | 122 | ||
| 123 | -// 经纬度转换为瓦片坐标 | 123 | +/** |
| 124 | + * 将经度转换为瓦片X坐标 | ||
| 125 | + * @param {number} lon - 经度值,范围为 -180 到 180 | ||
| 126 | + * @param {number} zoom - 缩放级别 | ||
| 127 | + * @returns {number} - 返回对应的瓦片X坐标 | ||
| 128 | + * | ||
| 129 | + * 计算过程说明: | ||
| 130 | + * 1. lon + 180:将经度范围从 [-180, 180] 转换为 [0, 360] | ||
| 131 | + * 2. /360:将范围归一化到 [0, 1] | ||
| 132 | + * 3. * Math.pow(2, zoom):根据缩放级别计算实际瓦片坐标 | ||
| 133 | + * 4. Math.floor:向下取整,确保返回整数坐标 | ||
| 134 | + */ | ||
| 124 | function lonToTileX(lon, zoom) { | 135 | function lonToTileX(lon, zoom) { |
| 125 | return Math.floor(((lon + 180) / 360) * Math.pow(2, zoom)); | 136 | return Math.floor(((lon + 180) / 360) * Math.pow(2, zoom)); |
| 126 | } | 137 | } |
| 127 | 138 | ||
| 139 | +/** | ||
| 140 | + * 将纬度转换为瓦片Y坐标 | ||
| 141 | + * @param {number} lat - 纬度值,范围为 -90 到 90 | ||
| 142 | + * @param {number} zoom - 缩放级别 | ||
| 143 | + * @returns {number} - 返回对应的瓦片Y坐标 | ||
| 144 | + * | ||
| 145 | + * 计算过程说明: | ||
| 146 | + * 1. lat * Math.PI / 180:将纬度从角度转换为弧度 | ||
| 147 | + * 2. Math.tan() + 1/Math.cos():计算墨卡托投影中的y值 | ||
| 148 | + * 3. Math.log():取自然对数 | ||
| 149 | + * 4. 1 - ... / Math.PI:将范围调整到 [0, 1] | ||
| 150 | + * 5. / 2:将范围进一步归一化 | ||
| 151 | + * 6. * Math.pow(2, zoom):根据缩放级别计算实际瓦片坐标 | ||
| 152 | + * 7. Math.floor:向下取整,确保返回整数坐标 | ||
| 153 | + */ | ||
| 128 | function latToTileY(lat, zoom) { | 154 | function latToTileY(lat, zoom) { |
| 155 | + // 将纬度转换为墨卡托投影坐标,然后计算对应的瓦片Y坐标 | ||
| 129 | return Math.floor( | 156 | return Math.floor( |
| 130 | ((1 - Math.log(Math.tan(lat * Math.PI / 180) + 1 / Math.cos(lat * Math.PI / 180)) / Math.PI) / 2) * Math.pow(2, zoom) | 157 | ((1 - Math.log(Math.tan(lat * Math.PI / 180) + 1 / Math.cos(lat * Math.PI / 180)) / Math.PI) / 2) * Math.pow(2, zoom) |
| 131 | ); | 158 | ); | ... | ... |
-
Please register or login to post a comment