-
Notifications
You must be signed in to change notification settings - Fork 17
/
merc.html
135 lines (129 loc) · 4.03 KB
/
merc.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
<!DOCTYPE html>
<!--
Avia routes in Mercator projection.
egax@bk.ru, 2013-21.
-->
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Маршруты / Canvas векторная карта</title>
<meta name="description" content="Маршруты на карте в проекции Меркатор">
<link rel="icon" href="img/fav.svg" type="image/svg+xml">
<link rel="stylesheet" href="css/style.css">
<style>html,body,table{overflow:hidden;margin:0;padding:0;width:100%;height:100%}</style>
<script src="/static/js/metrics.js" data-floor="1"></script>
</head>
<body>
<script src="js/proj4js-combined.js"></script>
<script src="js/dbcarta.js"></script>
<script src="js/data/countriesd.js"></script>
<script src="js/data/citiesd.js"></script>
<script src="js/data/flags.js"></script>
<script src="js/data/imgmap.js"></script>
<script>
function init() {
var mtab = document.createElement('table');
mtab.style.borderCollapse = 'collapse';
var row = document.createElement('tr');
row.style.borderBottom = '1px solid #f4f4f4';
row.style.height = '1px';
mtab.appendChild(row);
var col = document.createElement('td');
col.width = '15%';
var el2 = document.createElement('h1');
el2.appendChild(document.createTextNode('Маршруты'));
var el = document.createElement('a');
el.appendChild(el2);
el.href = '/dbcartajs';
col.appendChild(el);
row.appendChild(col);
var row = document.createElement('tr');
var col = document.createElement('td');
col.colSpan = '10';
col.id = 'mcol';
col.style.padding = "0";
row.appendChild(col);
mtab.appendChild(row);
document.body.appendChild(mtab);
DV = new dbCarta({id:'mcol', height:col.offsetHeight});
DV.initProj(101, '+lon_0=0 +lat_0=0');
// DV.scaleCarta(1.4);
// worldmap img
var im = new Image();
im.src = IMGMAP['wrld_small_merc'];
im.onload = function() {
DV.loadCarta([{0:'.Image', 1:'wrld', 2:[[-179.99,180],[179.99,-180]], 6:this}]);
DV.m.bgimg = DV.mflood['.Image_wrld']; // mark as bg
DV.loadCarta(DV.createMeridians());
// draw countries
var clist = [
{
'Cuba': [1,0],
'Mexico': [4,0],
'Ecuador': [0,1]
},
{
'Saudi Arabia': [1,0],
'Kenya': [0,3]
},
{
'Italy': [1,7],
'India': [5,12]
},
{
'Brazil': [12,4],
'South Africa': [1,1],
'Spain': [0,5]
}
];
DV.extend(DV.mopt['Line'], {fg:'orange'});
DV.extend(DV.mopt['Area'], {labelcolor:'beige'});
for(var ii=0; ii<clist.length; ii++) {
var cntrylist = clist[ii];
var route = [];
for(var cntryname in cntrylist) {
var npart = cntrylist[cntryname][0],
ncity = cntrylist[cntryname][1],
m = {};
for(var mpart in COUNTRIES[cntryname]) {
m.abbr = COUNTRIES[cntryname][mpart][0];
m.coords = COUNTRIES[cntryname][mpart][1];
m.centerof = COUNTRIES[cntryname][mpart][3];
DV.loadCarta([['Area', m.abbr + mpart, m.coords, (mpart==npart ? cntryname : ''), m.centerof]]);
};
// city
if (CITIES[cntryname]) {
m.cityname = CITIES[cntryname][ncity][0];
m.citycoords = CITIES[cntryname][ncity][1];
DV.loadCarta([['DotPort', m.cityname, m.citycoords, m.cityname, null, 1]]);
route.push(m.citycoords[0]);
// flags
var abbrf = m.abbr.replace(mpart, '').toLowerCase();
if (FLAGSB64[abbrf]) {
var im = new Image();
im.m = m;
im.src = FLAGSB64[abbrf];
im.onload = function() {
var m = this.m;
DV.loadCarta([{0:'.Image', 1:m.abbr, 2:[m.citycoords], 6:this}], 1);
}
}
}
}
// concat
if (route) {
route.push(route[0]);
route.push(route[1]);
};
DV.loadCarta([['Line', 'route'+String(ii), route, null, null, 1]]);
};
delete COUNTRIES;
delete CITIES;
DV.draw();
}
};
init();
</script>
</body>
</html>