GeoRSSを使って,吹き出しマークを出した状態でGoogle Mapを開けるようにした.

GeoRSSでGoogleMapと連携する

最近,風景写真集のページに行程表と地図を入れていて,一緒にGoogle Mapへのリンクも付けていたのだが, 機能としては単にノッペリとそのエリアのGoogle Mapが開くだけで,いまいちだった.

もう少しましな連携ができないかと調べたところ,GoogleMapは外部のGeoRSS のファイルを読むことができることがわかった.

GeoRSSは,RSS,Atomで使える語彙の一つで,

  • 点 (1点で構成)
  • 線 (2点以上で構成)
  • ボックス (対角の2点で構成)
  • ポリゴン (4点以上で構成)

を表現できるらしい.

こういう語彙っていうのは,それ自体はあまり重要ではなく,「広く使われているかどうか?」が重要なのだが, Googleが使っているというのはその点非常に強力だ.

GeoRSSの書き方

今回使ったのは一番簡単な点の指定.まず
xmlns:georss="http://www.georss.org/georss"
で名前空間georssを宣言して,こんな感じで点を記述する.
<georss:point>35.272298 136.263111</georss:point>
  • 世界測地系WGS84の 緯度,経度の順
  • 半角スペースまたはカンマで区切って

記述すれば良い.最初,間違って経度,緯度の順で記述してたら,Google Mapでエラーが出続けてはまった.

RSS 1.0として記述する例

Google Mapの動きを見ていると,RSSに記述する各アイテムの属性はこんな感じの使われ方をしている.
属性GoogleMap左パネル部GoogleMap地図部
title見出しとして出る吹き出しのタイトル
link吹き出しのタイトルのリンク先
description先頭1行程度が見出しの下に出る吹き出し内に全文が出る.HTMLタグは有効
dc:creator-吹き出しのタイトルの下に作成者として出る
georss:point-マーカーの座標

※dcは,Dublin Coreの語彙

なので,今回のGoogle Map連携だけの用途なら,最低限

  • title
  • link
  • description
  • georss:point

を設定すれば良さそうだ.

GeoRSSの例.item1個だけ抜粋

<?xml version="1.0" encoding="utf-8" ?>
<rdf:RDF
 xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
 xmlns="http://purl.org/rss/1.0/"
 xmlns:dc="http://purl.org/dc/elements/1.1/"
 xmlns:georss="http://www.georss.org/georss"
>

<channel rdf:about="http://kamoland.com">
 <title>琵琶湖サイクリング(2009年5月)</title>
 <link>http://kamoland.com</link>
 <description></description>
 <items>
  <rdf:Seq>
   <rdf:li rdf:resource="http://kamoland.com/wiki/wiki.cgi?%C8%FC%C7%CA%B8%D0%A5%B5%A5%A4%A5%AF%A5%EA%A5%F3%A5%B0%282009%C7%AF5%B7%EE%29#mk1" />
  </rdf:Seq>
 </items>
</channel>
   <item rdf:about="http://kamoland.com/wiki/wiki.cgi?%C8%FC%C7%CA%B8%D0%A5%B5%A5%A4%A5%AF%A5%EA%A5%F3%A5%B0%282009%C7%AF5%B7%EE%29#mk1">
    <title>01. 彦根駅出発</title>
    <link>http://kamoland.com/wiki/wiki.cgi?%C8%FC%C7%CA%B8%D0%A5%B5%A5%A4%A5%AF%A5%EA%A5%F3%A5%B0%282009%C7%AF5%B7%EE%29#mk1</link>
    <description>9:40 彦根駅出発</description>
    <dc:date></dc:date>
    <dc:subject></dc:subject>
    <georss:point>35.272298 136.263111</georss:point>
   </item>
</rdf:RDF>
なお,<description>にHTMLを記述すると吹き出し内では有効なので,<img>タグを使って吹き出しに画像を出すことも可能.

画像を出す例

<description>TEST &lt;img src="http://kamoland.com/image/blog.jpg" width="212" height="83"&gt;</description>
georss1.jpg

カモランドでの連携の仕組み

カモランドでは,行程表のGeoRSSをCGIで動的に生成するようにしたので, GoogleMapに対しては,そのCGIのURLを渡している.

CGIのURL

http://kamoland.com/wiki/wiki.cgi?cmd=rss10koutei&p=%C8%FC%C7%CA%B8%D0%A5%B5%A5%A4%A5%AF%A5%EA%A5%F3%A5%B0%282009%C7%AF5%B7%EE%29

Google MapへのリンクURL

http://maps.google.com/maps?f=q&hl=ja&ie=UTF8&q=http%3A%2F%2Fkamoland.com%2Fwiki%2Fwiki.cgi%3Fcmd%3Drss10koutei%26p%3D%25C8%25FC%25C7%25CA%25B8%25D0%25A5%25B5%25A5%25A4%25A5%25AF%25A5%25EA%25A5%25F3%25A5%25B0%25282009%25C7%25AF5%25B7%25EE%2529
リンク先で開いたGoogleMap
georss2.jpg

ふぅ,とりあえずこれで満足,満足 ( ̄ー ̄)

もっと凝ったことをやろうとするとGoogle Maps APIが要るんだろうけど,メインは電子国土なのでそこまで深入りする気はない.(多分)

kamolandをフォローしましょう


© 2017 KMIソフトウェア