« 爆発注意!?のバッテリーが家にもあった | トップページ | ネットワークリンクでFlickrの写真を表示する手順その2
[プレースマークの保存とネットワークリンクを作る] »

2006.08.18

ネットワークリンクでFlickrの写真を表示する手順その1
[写真を表示するプレースマークを作る]

ネットワークリンクというのは簡単に言えば、プレースマークの実体をネットワーク上に置いて、MyPlacesに保存した実体へのリンクのためのプレースマークで表示するものです。
高度な利用法だと夏の風物詩マップや、台風や雲の状況などの気象情報マップ、道路状況、その他ニュースをどんどん更新していくようなプレースマーク、商業的な最新の情報をネットワークリンクで顧客に提供するものなど想像できないくらい広い範囲の利用方法があると思います。
しかし、そんな難しいのは全然わからないのでさておいて(!)、ここでは単純なネットワークリンクの一例を紹介します。先日アップしたネットワークリンクでプレースマークの吹き出しに写真を表示させて、なおかつ大きな写真へのリンクも作る方法です。

参照記事:「写真のプレースマークをネットワークリンクで」8/16

今回は、まず写真入のプレースマークを作るところまで。

■Google Earth上にプレースマークを作る

Google Earthでフォルダを一つ作ります。使う写真に応じて名前を付けてください。そのフォルダを選択した状態で写真を貼りたい場所にプレースマークを作ってください。アイコンは何でもいいですが、ここはとりあえずカメラアイコンで。

フォルダやプレースマークの作り方は以下のサイトにすでに丁寧に説明されていますのでぜひ参考にしてください。

Noblesse-Oblige: 「Placemarkをつける」

■貼りこむ写真の準備

Picasaでも写真入のプレースマークは作れますが以前紹介しているので、今回は写真もネット上においてリンクさせるやり方にします。写真をアップロードできるスペースも無料で利用できるところがずいぶん増えていますが、Flickrがプレースマークを作るのにとても楽にできるので、Flickrを使って作ります。

Flickrはサイトが英語なのでちょっと敷居は高いですが、英語の苦手な私でも何とかアカウントをとってアップロードできたので、それほど難しいことはありません。下記のサイトで詳しく登録方法など日本語で解説して下さっています。

カメラ日和:「Flickrを楽しもう!」

Blog-tea:
「Flickr!の始め方簡易マニュアル」 
「Flickr!の楽しみ方簡易マニュアル-アップロード編」
「Flickr!の楽しみ方簡易マニュアル-その2」

フリッカーFAQ日本語訳

スペースを取得したらプレースマークにしたい写真をアップロードします。アップロードにはFlickr Uploadrを使うとドラッグアンドドロップでまとめてアップロードできて便利です。

さて、写真がアップロードできたら、写真の上部にあるAll Sizesをクリックします。

060818_1

オリジナルサイズの写真の上部に小さなサイズから大きなものまで何段階ものサイズが出てきます。この中で「吹き出しに使いたいサイズ」を選びます。
あまり大きいと画面を占領してしまうので、ThumbnailかSmallくらいがいいと思います。

060818_2

選んだサイズをクリックして表示されたページの下のほうに画像を貼るためのHTMLが表示されます。
2種類ありますが、
1. Copy and paste this HTML into your webpage:
のHTMLを使います。こちらはFlickrの大きな写真ページへのリンクが含まれています。

060818_3

■プレースマークに写真を貼りこむ

最初に作っておいたプレースマークを右クリックしてメニューを出します。Google Earth V3ならば一番上の「Edit」、V4ならば一番下の「Properties」をクリックしてプレースマークを再編集します。
「Description」のタブの記入欄に先ほどFlickrのページに表示された
1. Copy and paste this HTML into your webpage:
の四角の枠内のHTMLをそっくりコピーして貼り付けます。

基本的にはそれだけでとりあえず写真が表示されるはずですが、いかがでしょうか。吹き出しの写真をクリックすればブラウザが立ち上がって、Flickrの大きな写真が表示されるはずです。

先日の例のように簡単な説明を加えたい場合は上記のHTMLの記述に続けて<P>ここに説明を記入</P>と付け足せば、写真の下に説明文が表示されます。長い分で途中に改行を入れたい場合には改行部分に<br>とはさむことで改行されて表示されます。
HTMLを書ける方ならいくらでも応用はできます。説明や必要なリンクなども書き込んで中身の濃い吹き出しにすることも可能です。ホームページ作成ソフトを使って書き込みたい内容を作ってそのソースを上記に続けて書き込んで見ても良いかも。

参考
<div align="center"><a href="http://www.flickr.com/photos/28249322@N00/216628859/" title="Photo Sharing"><img src="http://static.flickr.com/81/216628859_14704ebbd7_m.jpg" width="240" height="135" alt="takahsimaya" /></a><br>クリックで大きく</div>
<P>
新宿駅南口横断歩道橋(撮影ポイント1)から高島屋を撮る
</P>

上記は高島屋のプレースマークの記述です。写真と写真直下の「クリックで大きく」と付け加えた説明までをセンタリングするために<div align="center">~</div>でその部分をくくり、そのあとに説明を<P>~</P>でくくって付け加えてあります。

-----------------------------------------------

個人的にアルバムのように使いたいなら、ここまでの作業で自分の写真をいつでもGoogle Earth上で見られるようになります。(プライベートなアルバムを作る場合にはFlickrの写真の設定をPublicでなく、Privateに設定しておくことをお忘れなく。)
また、ネットワークリンクにはしなくとも、フォルダにまとめたプレースマークをファイルにしてメールで知り合いに送って見てもらったりということもできます。画像はネットにリンクしているのでファイルも小さくて済みます。
自分用でも、旅行ごとにファイルにして保存しておいてもいいですね。

ファイルの保存などまた続きで書きます。

# Flickrに関してはまだまだ試したばかりでよくわからないのですが、上記の参考ページなど見るとかなり面白そうなものですね。Google Earthなど、Mapとの連携もフリーのツールも入れればずいぶんすすんできているようです。

 

|

« 爆発注意!?のバッテリーが家にもあった | トップページ | ネットワークリンクでFlickrの写真を表示する手順その2
[プレースマークの保存とネットワークリンクを作る] »

Google Earth TIPS」カテゴリの記事

コメント

コメントを書く



(ウェブ上には掲載しません)


コメントは記事投稿者が公開するまで表示されません。



トラックバック

この記事のトラックバックURL:
http://app.cocolog-nifty.com/t/trackback/170323/11493796

この記事へのトラックバック一覧です: ネットワークリンクでFlickrの写真を表示する手順その1
[写真を表示するプレースマークを作る]
:

« 爆発注意!?のバッテリーが家にもあった | トップページ | ネットワークリンクでFlickrの写真を表示する手順その2
[プレースマークの保存とネットワークリンクを作る] »