Google Earth(TM) 地図サービスのオススメスポット・Wiki更新状況・おもしろい情報の紹介などを書き綴っていきます。

水曜日, 8月 13, 2008

Google Earth APIのサンプルを読む その2

 前回の続きです。作成したプレイスマークを利用してみます。 window.alert(feature.getChildNodes().item(0).getGeometry().getLatitude());  前回紹介したサンプルでは、上記の記述によって、一番最初のプレイスマークの緯度をalertするようにしています。  item関数がポイントです。サンプルではfeatureに格納したplacemarkたちの中でインデックスが「0」のものを呼んでいます。そこから位置情報の中の緯度を呼び出しているわけです。 var item = feature.getChildNodes().getLength();  ちなみに、featureに格納されている子要素(ここではplacemark)の数を得るには上記のようにgetLength関数を利用します。  Google Earth APIを利用してプレイスマークを表示したり、その位置情報を利用したりするわけですが、これだけだと、今までのMaps APIを利用してコンテンツを表示する時と比べての優位点がイマイチわかりません。Maps APIにG_SATELLITE_3D_MAPを加えれば事が足りることが多そうな気がします。もっとほかの機能も見てみないといけませんね。

日曜日, 8月 10, 2008

Google Earth APIのサンプルを読む その1

妻「実家に帰らせていただきます。」  というのはネタですが、お盆で妻は実家へ。時間が出来たので久々にブログの更新をしようと思い立ちました。  というわけで、Google Earth APIのサンプルを読んで、使い方を学んでみようと思います。ちなみに、Google Earth APIのリファレンスが公開されていましたので、そちらも要チェックです。  「別に、GoogleEarthAPIではなく、Google Maps APIで良いんじゃない?」みたいな部分もあろうかと思いますが、そういうことは考えないことにします。 http://cubic-sight.net/kura/blog/080810/index.html  動作としては、Yahoo!ローカルサーチで東京のある地点の緯度経度をクーポン検索し、それをGoogleEarth上に展開。その後、最初のアイテムの緯度をポップアップするという感じです。  javascriptの記述をまとめたものはこちらです。中身を順に見ていきます。
google.load("earth", "1");
var ge = null;
function init() {
   google.earth.createInstance("map3d", initCallback, failureCallback);
}
function initCallback(object) {
  ge = object;
  ge.getWindow().setVisibility(true);
}
function failureCallback(object) {
}
まずは、Google Earth APIを利用するための初期化部分です。サンプル通りです。
function setplacemark(xmldata){
  var xml = xmldata.responseXML;
  var ydata = xml.getElementsByTagName("Item");
  var feature =  ge.getFeatures(); →①
  for(var i = 0; i <>
    var name = ydata[i].getElementsByTagName("Title")[0].childNodes[0].nodeValue;
    var wgs = ydata[i].getElementsByTagName("DatumWgs84");
    var latitude = wgs[0].getElementsByTagName("Lat")[0].childNodes[0].nodeValue;
    var longitude = wgs[0].getElementsByTagName("Lon")[0].childNodes[0].nodeValue;
    var placemark = ge.createPlacemark(""); →②
    placemark.setName(name);
    feature.appendChild(placemark); →③
    var item = feature.getChildNodes().getLength();
    var point = ge.createPoint(""); →④
    point.setLatitude(latitude);
    point.setLongitude(longitude);
    placemark.setGeometry(point); →⑤
    var balloon = ge.createFeatureBalloon('');
    balloon.setFeature(placemark);
    placemark.setDescription(item);
    ge.setBalloon(balloon);
  }
  window.alert(feature.getChildNodes().item(0).getGeometry().getLatitude());
}
Google Earth APIと関係の無いXMLデータの取得などもあるのでゴチャゴチャしています。番号を振りましたので、番号順に見ていきます。 ①Placemarkの入れ子としてFeaturesを作ります。リファレンスを見るとFolderとかDocumentといったところも使えるようですが、ここでは試さずに、直接Featuresを呼んでしまいます。 ②Placemarkを作ります。次の行ではPlacemarkの名前をつけています。 ③FeaturesにPlacemarkをしまいます。 ④ここからPlacemarkに緯度・経度を設定するのに使うPointを作成します。 ⑤Placemarkに先ほど作ったPointを設定します。  とりあえず、Placemarkを設定するのはこんな感じです(他のitem数を得たり、緯度を得たりするのはまた今度。)。抽象タグまで含めてKMLのリファレンスを念頭に置いておくと、しっくりくるような気がします。