antoinefortin
3/22/2018 - 8:58 PM

## [MTL-UNIMap]

[MTL-UNIMap]

var mapimg;
var montreal = {

lat: 45.501689,
long: -73.567256
}

var clat = montreal.lat;
var clon = montreal.long;

var lat = montreal.lat;
var lon = montreal.long;
var zoomLevel = 9;

}

function mercX(long) {
var a = (256 / PI) * pow(2, zoomLevel);
var b = long + PI;
return a * b;
}

function mercY(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;

for (var i = 0; i < unis.length; i++) {
var _current = unis[i];

var cx = mercX(clon);
var cy = mercY(clat);
var x = mercX(_current.coordinate.long) - cx;
var y = mercY(_current.coordinate.lat) - cy;
fill(_current.color);
// Then draw it to its x,y position
ellipse(x,y,20,20);

}

}

function draw() {
for (var i = 0; i < unis.length; i++) {
var _current = unis[i];

var cx = mercX(clon);
var cy = mercY(clat);

var x = mercX(_current.coordinate.long) - cx;
var y = mercY(_current.coordinate.lat) - cy;

// For what reason I need to bound them to the center
x += width / 2;
y += height / 2;
ellipse(x,y,5,5);

}
}

console.log("ss");
var unis = [{
"name": "McGill",
"color": "#dc241f",
"coordinate": {
"lat": "45.504785",
"long": "-73.577151"
},
"dataSets": [{
"name": "Students",
"id": "1"

},
{
"name": "Teachers",
"id": "1"
}
]
},

{
"name": "UQAM",
"color": "#0079be",
"coordinate": {
"lat": "45.512600",
"long": "-73.560595"
},
"dataSets": [{
"name": "Students",
"id": "2"

},
{
"name": "Teachers",
"id": "2"
}
]
},

{
"name": "UDM",
"color": "#000080",
"coordinate": {
"lat": "45.505616",
"long": "-73.613759"
},
"dataSets": [{
"name": "Students",
"id": "3"

},
{
"name": "Teachers",
"id": "3"
}
]
},

{
"name": "Concordia",
"color": "#32CD32",
"coordinate": {
"lat": "45.497266",
"long": "-73.579023"
},
"dataSets": [{
"name": "Students",
"id": "4"

},
{
"name": "Teachers",
"id": "4"
}
]
}
];