Eu fiz um tipo de mapa personalizado usando a API do Google Maps.
Usei o maptiler para criar as diferentes camadas de zoom e 0 camada (realmente reduzida) é um bloco de 256 x 256. A imagem cobre apenas 134 x 112 no entanto.
Eu quero ser capaz de fazer as coordenadas do mapa em relação a todo o mapa e não as coordenadas terrestres padrão do google maps. Por exemplo, o canto superior esquerdo deve ser (0,0) enquanto o canto inferior direito deve ser (50,50).
Recebi ajuda de Heitor Chang aqui: https://stackoverflow.com/questions/11192281/can-i-reset-latlng-coordinates-for-a-custom-map-type
O problema está aqui:
dayzProjection.prototype.fromLatLngToPoint = function(latlng) { // pixel size of tile at zoom 0 var max = 134; // define bottom-right corner as (50, 50) var x = max * latlng.lng() / 50; var y = max * latlng.lat() / 50; return new google.maps.Point(x, y); }; dayzProjection.prototype.fromPointToLatLng = function(pixel) { // inverse conversion var lng = pixel.x / max * 50; var lat = pixel.y / max * 50; return new google.maps.LatLng(lat, lng); };
Alguém pode me ajudar a transformar essas coordenadas.
Isso pode ajudar: https://developers.google.com/maps/documentation/javascript/maptypes#Projections
Resposta
É realmente possível colocar o canto superior esquerdo em 0,0 e o canto inferior direito em 50,50, Se você quer isso. Claro que você pode colocar o canto inferior direito em 10,10, também, ou o que for, dentro dos limites: -90 / + 90 para latitude e -180 / + 180 para longitude.
A proporção deve ser:
/* ****************************************** Custom Projection - CARTESIAN ****************************************** */ function CartesianProjection() { // map size at zoom 0 is equal to tile size this.tileSize = 256; }; CartesianProjection.prototype.fromLatLngToPoint = function(latLng) { var x = (latLng.lng() / 50) * this.tileSize; var y = (latLng.lat() / 50) * this.tileSize; return new google.maps.Point(x, y); }; CartesianProjection.prototype.fromPointToLatLng = function(point, noWrap) { var lng = (point.x / this.tileSize) * 50; var lat = (point.y / this.tileSize) * 50; return new google.maps.LatLng(lat, lng, noWrap); };
Em seguida, você deve colocar o centro do mapa em LatLng (25,25) nas opções do mapa.