Mobile 한국어

Google API 공부

오늘 :
688 / 10,525
어제 :
1,328 / 32,819
전체 :
3,274,022 / 154,885,168


SubKorea 검색
모든 웹사이트 검색

Open API 공부

Naver, Daum, Google Open API

추천 수 : 21 / 0
조회 수 : 3729
2007.11.30 (13:57:45)


go to 지정된 장소

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:v="urn:schemas-microsoft-com:vml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <title>Google Maps JavaScript API Example: Geocoding Cache</title>
    <script src="http://maps.google.com/maps?file=api&v=2.x&key=abc...xyz"
      type="text/javascript"></script>
    <script type="text/javascript">

  // Builds an array of geocode responses for the 5 cities.
  var city = [
    {
      name: "Washington, DC",
      Status: {
        code: 200,
        request: "geocode"
      },
      Placemark: [
        {
          address: "Washington, DC, USA",
          population: "0.563M",
          Point: {
            coordinates: [-77.036667, 38.895000, 0]
          },
          AddressDetails: {
            Country: {
              CountryNameCode: "US",
              AdministrativeArea: {
              AdministrativeAreaName: "DC",
                Locality: {LocalityName: "Washington"}
              }
            }
          }
        }
      ]
    },
    {
      name: "Tokyo, Japan",
      Status: {
        code: 200,
        request: "geocode"
      },
      Placemark: [
        {
          address: "Tokyo, Japan",
          population: "12.527M",
          Point: {
            coordinates: [139.770004, 35.669998, 0]
          },
            AddressDetails: {
            Country: {
              CountryNameCode: "US",
              AdministrativeArea: {
                AdministrativeAreaName: "CA",
                Locality: {LocalityName: "Los Angeles"}
              }
            }
          }
        }
      ]
    },
    {
      name: "Paris, France",
      Status: {
        code: 200,
        request: "geocode"
      },
      Placemark: [
        {
          address: "Paris, France",
          population: "2.144M",
          Point: {
            coordinates: [2.351019, 48.856662, 0]
          },
          AddressDetails: {
            Country: {
              CountryNameCode: "FR",
              Locality: {LocalityName: "Paris"}
            }
          }
        }
      ]
    },
    {
      name: "Rome, Italy",
      Status: {
        code: 200,
        request: "geocode"
      },
      Placemark: [
        {
          address: "Rome, Italy",
          population: "2.553M",
          Point: {
            coordinates: [12.482181, 41.895431, 0]
          },
          AddressDetails: {
            Country: {
              CountryNameCode: "IT",
              Locality: {LocalityName: "Roma"}
            }
          }
        }
      ]
    },
    {
      name: "Berlin, Germany",
      Status: {
        code: 200,
        request: "geocode"
      },
      Placemark: [
        {
          address: "Berlin, Germany",
          population: "3.396M",
          Point: {
            coordinates: [13.411895, 52.523781, 0]
          },
          AddressDetails: {
            Country: {
              CountryNameCode: "DE",
              Locality: {LocalityName: "Berlin"}
            }
          }
        }
      ]
    },
    {
      name: "Madrid, Spain",
      Status: {
        code: 200,
        request: "geocode"
      },
      Placemark: [
        {
          address: "Madrid, Spain",
          population: "3.228M",
          Point: {
            coordinates: [-3.703270, 40.416712, 0]
          },
          AddressDetails: {
            Country: {
              CountryNameCode: "ES",
              Locality: {LocalityName: "Madrid"}
            }
          }
        }
      ]
    }
  ];


  var map;
  var geocoder;

  // CapitalCitiesCache is a custom cache that extends the standard GeocodeCache.
  // We call apply(this) to invoke the parent's class constructor.
  function CapitalCitiesCache() {
    GGeocodeCache.apply(this);
  }

  // Assigns an instance of the parent class as a prototype of the
  // child class, to make sure that all methods defined on the parent
  // class can be directly invoked on the child class.
  CapitalCitiesCache.prototype = new GGeocodeCache();

  // Override the reset method to populate the empty cache with
  // information from our array of geocode responses for capitals.
  CapitalCitiesCache.prototype.reset = function() {
    GGeocodeCache.prototype.reset.call(this);
    for (var i in city) {
      this.put(city[i].name, city[i]);
    }
  }

  function initialize() {
    map = new GMap2(document.getElementById("map_canvas"));
    map.setCenter(new GLatLng(37.441944, -122.141944), 6);
    geocoder = new GClientGeocoder();
    geocoder.setCache(new CapitalCitiesCache());
  }

  function addAddressToMap(response) {
    map.clearOverlays();

    if (response && response.Status.code != 200) {
      alert("Unable to locate " + decodeURIComponent(response.name));
    } else {
      var place = response.Placemark[0];
      var point = new GLatLng(place.Point.coordinates[1],
                              place.Point.coordinates[0]);
      map.setCenter(point, 6);
      map.openInfoWindowHtml(point, "<b>City:</b> " + place.address
       + "<br><b>Population:</b> " + place.population);
    }
  }

  function findCity(which) {
    if (which != 0) {
      geocoder.getLocations(city[which - 1].name, addAddressToMap);
    }
  }
  </script>
</head>
<body onload="initialize()">
  <table>
  <tr>
    <td align="center">
      <b>Go to:</b>
      <select onchange="findCity(this.selectedIndex)">
        <option>Select capital</option>
        <option>Washington, USA</option>
        <option>Tokyo, Japan</option>
        <option>Paris, France</option>
        <option>Rome, Italy</option>
        <option>Berlin, Germany</option>
        <option>Madrid, Spain</option>
      </select>
    </td>
  </tr>
  <tr>
    <td>
      <div id="map_canvas" class="map" style="width:450px;height:400px"></div>
    </td>
  </tr>
  </table>
</body>
</html>

번호 제목 닉네임 등록일 조회 추천
52 marker-scroll 첨부 파일
cyber
2007-12-03 4047 20
51 directions-advanced 첨부 파일
cyber
2007-11-30 3776 23
50 directions-simple 첨부 파일
cyber
2007-11-30 3700 17
49 trafficOverlay 첨부 파일
cyber
2007-11-30 3263 33
48 geo-xml 첨부 파일
cyber
2007-11-30 3469 11
47 geoxml-kml 첨부 파일
cyber
2007-11-30 3660 11
46 geoxml-rss 첨부 파일
cyber
2007-11-30 3388 14
Selected geocoding-cache 첨부 파일
cyber
2007-11-30 3729 21
44 geocoding-extraction 첨부 파일
cyber
2007-11-30 2414 15
43 geocoding-simple 첨부 파일
cyber
2007-11-30 3762 12
Tag List