-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex.html
65 lines (56 loc) · 2.36 KB
/
index.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
<!doctype html>
<html>
<head>
<title>Kothic JS tile test</title>
<script src="test-tile.js" charset="utf-8"></script>
<!-- Include Kothic renderer sources -->
<script src="kothic.js"></script>
<!-- osmosnimki.ru style (Generated from MapCSS) -->
<script src="osmosnimki.js"></script>
</head>
<body>
<p>A demo of <a href="https://github.com/kothic/kothic-js">Kothic JS</a> map rendering engine.</p>
<canvas id="map" width="1024" height="1024"></canvas>
<script type="text/javascript">
invertYAxe(tile_data);
MapCSS.onImagesLoad = function () {
Kothic.render('map', tile_data, tile_zoom, {
styles: ['osmosnimki']
});
};
MapCSS.preloadSpriteImage("osmosnimki", "osmosnimki.png");
function invertYAxe(data) {
var type, coordinates, tileSize = data.granularity, i, j, k, l, feature;
for (i = 0; i < data.features.length; i++) {
feature = data.features[i];
coordinates = feature.coordinates;
type = data.features[i].type;
if (type == 'Point') {
coordinates[1] = tileSize - coordinates[1];
} else if (type == 'MultiPoint' || type == 'LineString') {
for (j = 0; j < coordinates.length; j++) {
coordinates[j][1] = tileSize - coordinates[j][1];
}
} else if (type == 'MultiLineString' || type == 'Polygon') {
for (k = 0; k < coordinates.length; k++) {
for (j = 0; j < coordinates[k].length; j++) {
coordinates[k][j][1] = tileSize - coordinates[k][j][1];
}
}
} else if (type == 'MultiPolygon') {
for (l = 0; l < coordinates.length; l++) {
for (k = 0; k < coordinates[l].length; k++) {
for (j = 0; j < coordinates[l][k].length; j++) {
coordinates[l][k][j][1] = tileSize - coordinates[l][k][j][1];
}
}
}
}
if ('reprpoint' in feature) {
feature.reprpoint[1] = tileSize - feature.reprpoint[1];
}
}
}
</script>
</body>
</html>