バングラデシュに愛の花を咲かせよう

地図と一緒に周辺の宿情報を紹介できるブログパーツ

こんなページを作ってみました。

関東以外の場合は、泊まりの人もいるだろうなと思って、周辺の宿を紹介したいと思いました。

BentoBox(TM)で地図と一緒にホテル情報が表示されるものがあったなと思って思い出して探してみると・・・・

ありました。

周辺ホテル表示パーツ(楽天トラベルforリンクシェア)

宿紹介ができるブログパーツはいくつかありましたが、宿情報だけでなく、地図も一緒に貼り付けられるものがよいなーと思って、こちらのブログパーツを選びました。

地域の地形情報と宿情報が一緒に取得できるのが便利です。

ページに貼り付けた様子

使うにはまず、リンクシェアとの提携、その上で楽天トラベルとの提携が必要です。
あとはグーグルのアカウント→グーグルマップAPIのキー。

リンクをクリックするとグーグルのページに飛びます。

 

APIキーを生成を押すと・・・


グーグルマップのAPIはサイトごとに発行されるので、違うサイトで利用する場合は、その都度取得が必要です。

私はグーグルのアカウントを持っているので、アプリのページのリンクからスムーズにAPIキーが取得できました。

今回私は苗場で検索しました。

地図の縮尺ですが、10だとこんな感じ。


17だとこんな・・・・。

14でちょうどいいぐらいでした。


数が少ないと縮小、数が多いと拡大って感じでしょうかね。

縮尺は、コードが発行された後、zoomの部分の数字を変更すれば表示状況が変わります。
(赤い太字の部分)

hotelno=30694っていうのはじゃらんのホテル番号なのでここも後で変更できます。

幅とか高さも600、300って書いてある部分です。
<script src="http://higaeri.b-new.net/hotelblogparts.php?hotelno=30694&ww=600&h=300&zoom=17&sid=++++&tok=+++++++_" type="text/javascript" charset="utf-8"></script></div>

キーワードからホテル検索を選ぶと、こんなリストが出ます。

私も最初はここがわからなかったんですが、このリストからひとつ宿泊施設を選ぶと、その宿泊施設を中心にして、周辺の宿泊施設が表示されます。

なぜこんなめんどくさそうな方法をと思われるかもしれませんが、APIとグーグルマップの組み合わせでこれが一番よいようです。(wackeyさん主催のAPIの勉強会でこういう方法でやったことがあります)

取得しないといけないキーやクーポンが多くて大変だなと思われるかもしれませんが、リンクシェアのアフィリエイトIDやWebサービス用のトークンはクッキーで保存されていたので、次も同じサイトで使う場合は、再入力が不要なのでその辺は便利かと思います。

モバイルバージョンを終了