チップス

google maps api v3を使って住所から緯度経度変換する


マーカーを変更して少しだけオリジナルな雰囲気にしてみました。


sample.html




  
  
  Google Maps v3 ぴよふぁくとりぃ
  
  


項目 情報
緯度
経度



sample.js

var geocoder;
var map;
function initialize() {
  geocoder = new google.maps.Geocoder();
  // 仙台市青葉区角五郎1-5-40
  var latlng = new google.maps.LatLng(38.2667202,140.8516019);
  var opts = {
    zoom: 15,
    center: latlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
    map = new google.maps.Map
    (document.getElementById("map_canvas"), opts);
    codeAddress();
}

function codeAddress() {
  var address = document.getElementById("address").value;
  if (geocoder) {
    geocoder.geocode( { 'address': address,'region': 'jp'},
    function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        map.setCenter(results[0].geometry.location);
        var bounds = new google.maps.LatLngBounds();
        for (var r in results) {
          if (results[r].geometry) {
            var latlng = results[r].geometry.location;
            bounds.extend(latlng);
            new google.maps.Marker({
              icon:{ url:'http://hoge.com/piyogeo.gif' },
              title:'ぴよふぁくとりぃ',
              position: latlng,map: map
            });
          document.getElementById('latitude').innerHTML = latlng.lat();
          document.getElementById('longitude').innerHTML = latlng.lng();
          }
       }
     }else{
       alert("Geocode 取得に失敗しました reason: "
         + status);
     }
   });
  }  // if (geocoder)
}

google maps api v3を使って住所から緯度経度変換する

sample.html の

に変更。


   チップス