1

I have made a custom map type using the Google Maps API.

I have used maptiler to create the different zoomlayers and the 0 layer (really zoomed out) is a 256 x 256 tile. The image only covers 134 x 112 however.

I want to be able to make the map coordinates relative to the whole map and not the default earth coordinates of google maps. For example, the top-left corner should be (0,0) while the bottom-right should be (50,50).

I have received help from Heitor Chang here: https://stackoverflow.com/questions/11192281/can-i-reset-latlng-coordinates-for-a-custom-map-type

The problem lies here:

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);
};

Can anyone help me transform these coordinates.

This may help: https://developers.google.com/maps/documentation/javascript/maptypes#Projections

1 Answer 1

2

It is actually possible to place your top left corner at 0,0 and your bottom right at 50,50, if you want this. Of course you can place bottom right corner at 10,10, too, or whatever, within the limits: -90/+90 for latitude and -180/+180 for longitude.

The proportion should be:

/*
****************************************** 
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);
};

Then you should place the center of the map to LatLng(25,25) in the Map options.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.