Skip to content

Instantly share code, notes, and snippets.

@antoinefortin
Created March 22, 2018 19:20
Show Gist options
  • Save antoinefortin/bf7eab094175a478f876a53dc15337f9 to your computer and use it in GitHub Desktop.
Save antoinefortin/bf7eab094175a478f876a53dc15337f9 to your computer and use it in GitHub Desktop.
[LATLONG Js on Flat]
var mapimg;
var clat = 0;
var clon = 0;
var lat = 31.2674;
var lon = 121.5221;
var zoomLevel = 1;
function preload() {
mapimg = loadImage("https://api.mapbox.com/styles/v1/mapbox/streets-v10/static/0.337798,0.810550,1,0.00,0.00/1024x512?access_token=pk.eyJ1IjoiYW50b2luZWZvcnRpbiIsImEiOiJjamYydXlsZzIwNnNlMndwNDUwa3pidXc4In0.a71O-Gs4UX9d2xLh9QaKMg");
}
function mercX(long) {
long = radians(long);
var a = (256 / PI) * pow(2, zoomLevel);
var b = long + PI;
return a * b;
}
function mercY(lat) {
lat = radians(lat);
var a = (256 / PI) * pow(2, zoomLevel);
var b = tan(PI / 4 + lat / 2);
var c = PI - log(b);
return a * c;
}
function setup() {
createCanvas(1024,512);
translate(width / 2, height / 2);
imageMode(CENTER);
image(mapimg,0,0)
var cx = mercX(clon);
var cy = mercY(clat);
var x = mercX(lon) - cx;
var y = mercY(lat) - cy;
fill(255,0,255,200, 200);
ellipse(x,y,20,20);
}
function draw() {
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment