|
|
import * as Utils from './utils.js'
|
|
|
|
|
|
export const viewport = {
|
|
|
width: 256,
|
|
|
height: 256,
|
|
|
zoom_level: 0,
|
|
|
xoffset: 0,
|
|
|
yoffset: 0,
|
|
|
}
|
|
|
|
|
|
//计算所有情况下的底图大小，包括非整数z
|
|
|
export function calTileSize() {
|
|
|
let etsize = 256
|
|
|
const zoom_level = viewport.zoom_level
|
|
|
if (zoom_level != Math.floor(zoom_level)) {
|
|
|
etsize = 256 * Math.pow(2, zoom_level - Math.floor(zoom_level + 1))
|
|
|
}
|
|
|
return etsize
|
|
|
}
|
|
|
|
|
|
export function calTileNum(coord) {
|
|
|
return Math.floor(coord / calTileSize())
|
|
|
}
|
|
|
|
|
|
export function setViewportSize(width, height) {
|
|
|
viewport.width = width
|
|
|
viewport.height = height
|
|
|
}
|
|
|
|
|
|
export function updateOffset() {
|
|
|
const z = viewport.zoom_level
|
|
|
}
|
|
|
|
|
|
export function map2viewport(mx, my) {
|
|
|
const vx = mx + viewport.xoffset
|
|
|
const vy = my + viewport.yoffset
|
|
|
return { x: vx, y: vy }
|
|
|
}
|
|
|
|
|
|
export function viewport2map(vx, vy) {
|
|
|
const mx = vx - viewport.xoffset
|
|
|
const my = vy - viewport.yoffset
|
|
|
return { x: mx, y: my }
|
|
|
}
|
|
|
|
|
|
export function setViewportCenterByWgs84(lat, lon, z) {
|
|
|
viewport.zoom_level = z
|
|
|
const size = calTileSize()
|
|
|
const mx = Utils.lon2x(lon, z) * size
|
|
|
const my = Utils.lat2y(lat, z) * size
|
|
|
console.log('测试', mx, my)
|
|
|
// const { vx, vy } = map2viewport(mx, my)
|
|
|
const cx = viewport.width / 2
|
|
|
const cy = viewport.height / 2
|
|
|
viewport.xoffset = cx - mx
|
|
|
viewport.yoffset = cy - my
|
|
|
}
|
|
|
|
|
|
export function setViewportCenterByMap(mx, my, z) {
|
|
|
viewport.zoom_level = z
|
|
|
const cx = viewport.width / 2
|
|
|
const cy = viewport.height / 2
|
|
|
viewport.xoffset = cx - mx
|
|
|
viewport.yoffset = cy - my
|
|
|
}
|
|
|
|
|
|
export function updateZoomLevel(vx, vy, newz) {
|
|
|
const oldz = viewport.zoom_level
|
|
|
const mxy = viewport2map(vx, vy)
|
|
|
viewport.zoom_level = newz
|
|
|
const scale = Math.pow(2, newz - oldz)
|
|
|
const newmxy = { x: mxy.x * scale, y: mxy.y * scale }
|
|
|
viewport.xoffset = vx - newmxy.x
|
|
|
viewport.yoffset = vy - newmxy.y
|
|
|
}
|
|
|
|
|
|
// //test
|
|
|
// setViewportSize(512, 512)
|
|
|
// setViewportCenter(0, 0, 0)
|
|
|
// console.log(map2viewport(0, 0))
|
|
|
// console.log(map2viewport(128, 128))
|
|
|
|
|
|
export function viewport2wgs84(vx, vy) {
|
|
|
const mlc = viewport2map(vx, vy)
|
|
|
const z = viewport.zoom_level
|
|
|
//数据超界处理, 这里对应缩放等级的地图的大小是
|
|
|
const limit = calTileSize() * Math.pow(2, z)
|
|
|
if (vx <= 0 || vy <= 0 || vx >= limit || vy >= limit) {
|
|
|
throw `OutMapRange limit ${limit}`
|
|
|
}
|
|
|
const lat = Utils.tile2lat(mlc.y / 256, z)
|
|
|
const lon = Utils.tile2long(mlc.x / 256, z)
|
|
|
return { lat: lat, lon: lon }
|
|
|
}
|
|
|
|
|
|
export function wgs84toviewport(lat, lon) {
|
|
|
//数据超界处理 经度自动限制在 -180 180
|
|
|
//85.0511287798066 (2*Math.atan(Math.pow(Math.E,Math.PI))-Math.PI/2)/Math.PI*180
|
|
|
const latlimit = 85.051128
|
|
|
const lonp = lon - Math.floor((lon + 180) / 360) * 360
|
|
|
if (lat < 0 - latlimit || lat > latlimit) {
|
|
|
throw 'OutMapRange'
|
|
|
}
|
|
|
const z = viewport.zoom_level
|
|
|
const my = Utils.lat2y(lat, z) * 256
|
|
|
const mx = Utils.lon2x(lonp, z) * 256
|
|
|
const vp = map2viewport(mx, my)
|
|
|
return { x: vp.x, y: vp.y }
|
|
|
}
|