root/lang/javascript/gmapcalc/maptosat.html @ 16750

Revision 16750, 2.5 kB (checked in by gyuque, 5 years ago)

set mime type

  • Property svn:mime-type set to text/html
Line 
1<?xml version="1.0" encoding="utf-8"?>
2<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
3<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
4        <head>
5                <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
6                <meta http-equiv="Content-Script-Type" content="text/javascript" />
7                <title>gmapcalc</title>
8
9                <style type="text/css">
10.err {
11        font-style: normal;
12        color: #d00;
13}
14
15#mapout {
16        position: relative;
17}
18
19#mapout div {
20        font-size: 0px;
21}
22
23#mapout img {
24        position: absolute;
25        top: 0;
26        left: 0;
27}
28
29                </style>
30
31                <script type="text/javascript" src="gmapcalc.js"></script>
32                <script type="text/javascript">
33function degToRad(d) {return d*0.01745329251994;}
34function radToDeg(r) {return r/0.01745329251994;}
35
36function start()
37{
38        var lat = document.getElementById("inlat").value - 0;
39        var lng = document.getElementById("inlng").value - 0;
40        var zm = document.getElementById("inzoom").value - 0;
41        var out = document.getElementById("out");
42
43        var xy = GoogleMapsCalc.LatLngToXY(degToRad(lat), degToRad(lng));
44        var mapSize = Math.pow(2, zm+8);
45        xy[0] = Math.floor(xy[0]*mapSize / GoogleMapsCalc.TILE_SIZE);
46        xy[1] = Math.floor(xy[1]*mapSize / GoogleMapsCalc.TILE_SIZE);
47
48        var loaders = [];
49        var i, j;
50        for (j = 0;j < 5;j++)
51        {
52                for (i = 0;i < 5;i++)
53                {
54                        loaders.push( new Loader((xy[0] + i - 2)/mapSize*GoogleMapsCalc.TILE_SIZE, (xy[1] + j - 2)/mapSize*GoogleMapsCalc.TILE_SIZE, zm, out, i, j) );
55                }
56        }
57
58        for (var li in loaders)
59        {
60                (function(ldr, delay){
61                        setTimeout(function(){ ldr.run(); }, delay);
62                })(loaders[li], (li-0)*500);
63        }
64}
65
66function Loader(x, y, zm, out, outx, outy)
67{
68        this.out = out;
69        this.zoom = zm;
70        this.x = x;
71        this.y = y;
72        this.outx = outx;
73        this.outy = outy;
74}
75
76Loader.prototype.run = function()
77{
78        var tile_path = GoogleMapsCalc.calcTilePath(this.x, this.y, this.zoom);
79        var img = document.createElement("img");
80        img.src = "http://khm2.google.co.jp/kh?n=404&v=29&t=" + tile_path;
81        img.style.position = "absolute";
82        img.style.left = (this.outx*256) + "px";
83        img.style.top = (this.outy*256) + "px";
84        this.out.appendChild(img);
85}
86
87
88                </script>
89        </head>
90
91        <body>
92<div id="out" />
93<p>
94緯度: <input value="9.05" type="text" id="inlat" /><br />
95経度: <input value="39.233333" type="text" id="inlng" /><br />
96ズーム: <input value="12" type="text" id="inzoom" /><br />
97<button style="font-size: 200%" onclick="void(start())">start</button>
98</p>
99        </body>
100</html>
Note: See TracBrowser for help on using the browser.