0x2620/oxjs
2
0
Fork 1
Code Issues 172 Pull requests Releases Wiki Activity

map demo

Browse source
This commit is contained in:
rlx 2011-03-04 16:25:29 +00:00
parent 9067e96499
commit 23eb7cd386
2 changed files with 106 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
demos/map/index.html Normal file
View file

@ -0,0 +1,14 @@
<!DOCTYPE HTML>
<html>
<head>
<title>ox.js map demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<link rel="stylesheet" type="text/css" href="../../build/css/ox.ui.css"/>
<script type="text/javascript" src="../../build/js/jquery-1.5.js"></script>
<script type="text/javascript" src="../../build/js/ox.js"></script>
<script type="text/javascript" src="../../build/js/ox.ui.js"></script>
<script type="text/javascript" src="../../build/js/ox.map.js"></script>
<script type="text/javascript" src="js/map.js"></script>
</head>
<body></body>
</html>

92
demos/map/js/map.js Normal file
View file

@ -0,0 +1,92 @@
$(function() {
var width = window.innerWidth - 256,
height = window.innerHeight,
map = new Ox.Map({
clickable: true,
height: height,
/*
places: Ox.COUNTRIES.map(function(country) {
return country.name;
}),
*/
places: [
{
flag: 'UK',
geoname: 'Westminster, London, UK',
name: 'London',
//lat: 51.5001524,
lat: 51.52670875,
lng: -0.1262362,
south: 51.3493528,
west: -0.378358,
north: 51.7040647,
east: 0.1502295
},
{
flag: 'FR',
geoname: 'Paris, France',
name: 'Paris',
lat: 48.8566667,
lng: 2.3509871,
south: 48.8155414,
west: 2.2241006,
north: 48.9021461,
east: 2.4699099,
}
],
statusbar: true,
toolbar: true,
width: width,
zoombar: true
})
.bindEvent({
selectplace: function(event, data) {
panel.replaceElement(1, list = new Ox.TreeList({
data: {
components: data.components,
countryCode: data.countryCode,
crossesDateline: data.crossesDateline,
east: data.east,
geoname: data.geoname,
lat: data.lat,
lng: data.lng,
name: data.name,
north: data.north,
size: data.size,
sizeEastWest: data.sizeEastWest,
sizeNorthSouth: data.sizeNorthSouth,
south: data.south,
west: data.west,
types: data.types
}
}));
}
}),
list = new Ox.TreeList({
data: []
})
panel = new Ox.SplitPanel({
elements: [
{
element: map
},
{
element: list,
size: 256
}
],
orientation: 'horizontal'
})
.appendTo($('body'));
map.gainFocus();
$(window).resize(function() {
map.options({
height: window.innerHeight,
width: window.innerWidth - 256
});
});
});