62 lines
No EOL
2.7 KiB
JavaScript
62 lines
No EOL
2.7 KiB
JavaScript
Ox.load('UI', {
|
|
debug: true,
|
|
hideScreen: true,
|
|
showScreen: true,
|
|
theme: 'modern'
|
|
}, function() {
|
|
|
|
Ox.loadJSON('json/cities100000.json', function(data) {
|
|
|
|
var listmap = new Ox.ListMap({
|
|
height: window.innerHeight,
|
|
places: data.map(function(city) {
|
|
var marker = city.population > 20000000 ? {size: 24, color: [255, 0, 0]} :
|
|
city.population > 10000000 ? {size: 22, color: [255, 32, 0]} :
|
|
city.population > 5000000 ? {size: 20, color: [255, 64, 0]} :
|
|
city.population > 2000000 ? {size: 18, color: [255, 96, 0]} :
|
|
city.population > 1000000 ? {size: 16, color: [255, 128, 0]} :
|
|
city.population > 500000 ? {size: 14, color: [255, 160, 0]} :
|
|
city.population > 200000 ? {size: 12, color: [255, 192, 0]} :
|
|
city.population > 100000 ? {size: 10, color: [255, 224, 0]} :
|
|
{size: 8, color: [255, 255, 0]},
|
|
size = Math.sqrt(city.population * 100),
|
|
latSize = size / Ox.EARTH_CIRCUMFERENCE * 360,
|
|
lngSize = size * Ox.getDegreesPerMeter(city.latitude);
|
|
return Ox.extend({
|
|
countryCode: city.country_code == 'XK' ? 'RS-KO' : city.country_code,
|
|
editable: true,
|
|
flag: city.country_code,
|
|
geoname: city.name,
|
|
markerColor: marker.color,
|
|
markerSize: marker.size,
|
|
name: city.name,
|
|
size: city.population * 100,
|
|
type: 'city',
|
|
lat: city.latitude,
|
|
lng: city.longitude,
|
|
south: city.latitude - latSize / 2,
|
|
west: city.longitude - lngSize / 2,
|
|
north: city.latitude + latSize / 2,
|
|
east: city.longitude + lngSize / 2
|
|
});
|
|
}),
|
|
width: window.innerWidth
|
|
})
|
|
.bindEvent({
|
|
geocode: function(event, data) {
|
|
Ox.print(event)
|
|
Ox.print(JSON.stringify(data))
|
|
}
|
|
})
|
|
.appendTo(Ox.UI.$body);
|
|
$(window).resize(function() {
|
|
Ox.print('RESIZE', window.innerHeight)
|
|
listmap.options({
|
|
height: window.innerHeight,
|
|
width: window.innerWidth
|
|
});
|
|
});
|
|
|
|
window.listmap = listmap;
|
|
});
|
|
}); |