忍者ブログ

旅行+生活情報+ドイツ語と、ちょっと言いたい今日のドイツ

×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

(拍手のコメントにはカテゴリー「拍手へのお返事」でお返事を書いています)
↓ ぽちっと応援、よろしくお願いします。感謝!↓
にほんブログ村 海外生活ブログ ドイツ情報へ ブログランキングならblogram ジモモ フランクフルト
2012/05/16 (Wed)
Google map の使い方と、サイトやブログへの埋め込み方
前の記事で著作権問題をクリアできる無料写真配布サイトWikipedia に投稿された写真を転用する方法を書きましたが、ここまで書いたらついでにGoogle map をサイトやブログに埋め込む方法も書いておこうかなと思います。

Google の検索トップページに探したい町や地域の名前、住所などを記入した後、ページの左上にあるリンクから地図を選ぶと、Google map が表示されます。

Google map ( Wikipedia 日本語版)
Google ストリートビュー( Wikipedia 日本語版)

例として、ここでは「ベルリン」と記入して地図をクリックしてみます。
はっきりした住所を入れて検索すると、その地域の地図が出てきます。
下の画像の赤丸が地図のリンクです。
ちょうど母の日だったので、ロゴがいつもと違います。

せっかくなので、ついでに「もっと見る」の中に入っているリストも出してみました。
リストの中に入っている「翻訳」は、単語なら結構役に立ちます。
文章になると、奇奇怪怪な翻訳になっちゃいますけど(苦笑)

Google 検索トップページ
町や地域の名前や住所を入れて、地図をクリックする

検索結果が出る
検索結果が出て、ベルリン地区の地図が表示される

  • 地図は拡大して家並みにしたり、縮小して世界を見ることもできます。マウスをスクロールすることでも拡大縮小ができます。
  • 左上の円盤は上下左右に動くためですが、マウスを地図の上で左クリックしたまま動かしても移動させることができます。
  • 左側の黄色い人型はストリートビューや投稿された写真を見るためで、マウスを左クリックそたまま道路に持って行くと、道路に青いラインができるところではストリートビューが見られます。
  • 右上には地図への切り替えボタンがあり、ここにマウスを持って行くと、Google Earth への切り替えボタンも出てきます。
  • Gogle Earth は、有名な場所では地図を3Dで見ることもできます。

Google map はストリートビューが見られますが、その使い方を知らない方用にちょっと説明を書いておきます。
ストリートビューとは、Google が世界の主要都市の道路を複数のカメラを搭載した車で走り、撮影した写真をGoogle map で公開しているサービスです。

自宅を勝手に撮られたとか、歩行者の顔がはっきり分かるなどのプライバシー問題を受けて、車のナンバーや人物の顔などにぼかしが入るようになりましたが、ストリートビューのメリットは旅行先の様子を詳しく見られること。
パリに予約したホテルの周りにスーパーがあるかどうかとか、駅からどの道を行けば目的地に行けるかとか、実際に目印になる建物をその場所に行く前に確認できるので、向こうに行っても迷うことがない。
私も、旅行の前には必ずストリートビューでホテルやスーパー、レストランなどの位置を確認してます。

ストリートビューの表示の仕方は簡単です。
地図の左側にある黄色い人型を、マウスを左クリックしたまま地図上に移動させてきてください。そうすると、ストリートビューがある道路に青いラインが出てきます。
これは、ここをGoogle のストリートビュー撮影車が通ったということ。
私も撮影車を見かけた頃があるのですが、車の横に大きく「Google」と書いてありました。
ということは、私もストリートビューのどこかに映ってたりして・・・

マップの使い方
道路上のライン部分がストリートビューできる道で、点はその場所の写真

人型が置かれた場所のストリートビューが出てきたら、カメラの方向を調節してください。
  • 画像左上の円盤の矢印をクリックすると、左右上下に画像が移動します。
  • 道路上にある白い矢印をクリックすると、道路を前に進んだり、曲がったりします。世界のある場所を、ストリートビューを見ながら疑似体験するとができる訳です。
  • 投稿写真がその場所にある場合は、写真マークが出てきます。これをクリックすれば、ユーザーが投稿した写真を見ることもできます。
  • ストリートビューから元の地図に戻りたい時は、右上の×をクリックすれば戻ります。
ストリートビュー
ストリートビューでベルリンのブランデルブルグ門の前に立ってみた

Google Street View Car in CeBIT 2010
WIkipedia より、2010年にドイツで公開されたGoogle の新しいストリートビュー撮影車


Google がストリートビューに関しての詳しい説明を自サイトに載せています。
使い方やストリートビューの見られる場所などの他に、面白い話も載っていますので、ここの記事で使い方が分かった方も分からなかった方も(^^;)読んでみてください。
Google マップ ストリートビュー解説サイト


さて、次はGoogle map の貼り付け方ですが、長くなるので追記に入れてあります。
サイトやブログの中にGoogle map を埋め込んでみたい方は、追記をお読みください。

拍手[0回]


さて、それでは地図の貼り付け方です。
Google map の左上にリンクのボタンがあるので、これをクリックします。
すると横に、そのページのURLと埋め込み用コードが出てきます。
サイトをお持ちの方はお分かりだと思うので、ここから先はブログに地図を貼り付けたい方用に説明します。

リンクボタン
リンクボタンを押すと、埋め込み用コードが出てくる

埋め込み用コード
ページへのURLと埋め込み用コード

文字リンクにしたい場合は上のコードを、地図を埋め込むなら下のコードをコピーします。
埋め込みコードをコピーしたら、エディターをHTMLにして、お好きなところに貼り付けます。
注)エディターのHTMLへの切り替えは前回の「Wikipedia の写真をサイトやブログに活用しよう」の追記で説明していますので、切り替え方を知らない方は前記事をお読みください。

貼り付けた地図は下のように表示されます。
地図を拡大してからリンクボタンをクリックすると、埋め込む地図も拡大されています。


大きな地図で見る ベルリン広域の地図


大きな地図で見る ベルリンを拡大した地図

あれ?と思った方がいますね?
そう、マップのサイトでは出ていなかった吹き出しが、埋め込んだ地図ではドバッと大きく出てきていて、それも上部が切れているから何が書いてあるのか読めない。

地図をマウスか左上にある矢印で動かして、吹き出しが見えるところまで移動させれば読めますが、吹き出しなんかないほうがいいと思う方もいるはず。
じゃあ、吹き出しを消すにはどうしたかいいのか?

吹き出しを消すには、ちょいと手作業が必要になります。
まず、埋め込み用のコードをコピーしてメモ帳やノートパッドに貼り付け、最初のカギ括弧(<  >)の最後のところ、</iframe>の前に「&amp;iwloc=B」を加えます。
下にベルリンの地図のコードを持ってきました。赤字が追加したところです。

<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.co.jp/maps?hl=ja&amp;q=%E3%83%99%E3%83%AB%E3%83%AA%E3%83%B3&amp;ie=UTF8&amp;hq=&amp;hnear=%E3%83%99%E3%83%AB%E3%83%AA%E3%83%B3+%E3%83%89%E3%82%A4%E3%83%84&amp;ll=52.519171,13.406091&amp;spn=0.034314,0.090895&amp;t=h&amp;z=14&amp;brcurrent=3,0x0:0x0,0&amp;output=embed&amp;iwloc=B"></iframe><br /><small><a href="http://maps.google.co.jp/maps?hl=ja&amp;q=%E3%83%99%E3%83%AB%E3%83%AA%E3%83%B3&amp;ie=UTF8&amp;hq=&amp;hnear=%E3%83%99%E3%83%AB%E3%83%AA%E3%83%B3+%E3%83%89%E3%82%A4%E3%83%84&amp;ll=52.519171,13.406091&amp;spn=0.034314,0.090895&amp;t=h&amp;z=14&amp;brcurrent=3,0x0:0x0,0&amp;source=embed" style="color:#0000FF;text-align:left">大きな地図で見る</a></small>

このコードをコピーして埋め込んでみると、邪魔な吹き出しが出なくなりました。
マーカーの赤いAをクリックすると、吹き出しがまた出てきます。
このほうがすっきりしてますね。

地図の右上には「地図」、「写真」、「地形」、「Earth」の切り替えボタンが並んでいます。
それぞれを押して、変化を見てみましょう。


大きな地図で見る
 吹き出しのない地図


吹き出しもマーカーも消したい場合、または複数のマーカーが邪魔な場合は、消し方を下のサイトで詳しく説明していますので、こちらをお読みください。
Google マップの埋め込み HTML でふきだしを消す方法(新)

ここに紹介した吹き出しの消し方も、同じサイトを参照しています。
Google マップの埋め込み HTML でふきだしを消してマーカーを残す方法

(拍手のコメントにはカテゴリー「拍手へのお返事」でお返事を書いています)
↓ ぽちっと応援、よろしくお願いします。感謝!↓
にほんブログ村 海外生活ブログ ドイツ情報へ ブログランキングならblogram ジモモ フランクフルト
コメント
NAME
TITLE
MAIL (非公開)
URL
EMOJI
Vodafone絵文字 i-mode絵文字 Ezweb絵文字
COMMENT
PASS (コメント編集に必須です)
SECRET
管理人のみ閲覧できます
 
  
カレンダー
10 2019/11 12
S M T W T F S
1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
ランキング
一日一回ポチっと応援してくださると、管理人が大喜びしますw   

日本ブログ村
にほんブログ村 海外生活ブログ ドイツ情報へ

こちらは面白ランキングのblogram 。一風変ってる!
blogram投票ボタン

フランクフルトの生活情報サイト、Jimomo Frankfurt です
ジモモ フランクフルト

なんだかどうでもいい、ヨーロッパランキングのEUROPE COLOR
ヨーロッパ在住の日本人によるブログ
著作権について
Creative Commons License
このブログの内容の文章や画像は、クリエイティブ・コモンズ・ライセンスの下でライセンスされています。無断リンクなし転載はお断りいたします。

Creative Commons License
This work is licensed under a Creative Commons
AD
PR
ブログ内検索
黒猫 maukie
ゲーム付きMaukie 君をゲットしました。マウスを持って行くとじゃれます(OPERAでは動きません)。下のボタンでゲームに切り替わるので、遊んでいってくださいな。数独からMaukie 君に戻るときはページを更新してください。
ブックマーク
ドイツ語と料理のページです
   by Luna Meer 様
熊子の冬眠ライフ
   by 熊子様
オナモミ亭~猫柳一番地
   by オナモミ様
ドイツ田舎暮らし
   by アイスベア様
Sonnen Katze
   by Tomimaru 様
ラーダ・ドゥーナのZAKKAスクラップ
   by ラーダ・ドゥーナ様
Jimmy in ドイツ
   by Jimmy 777様
地球ワーキングトラベラー見聞録
   by takechan0312様

バナーリンク
♥ オナモミさんの新本館登場
おじゃもみ亭 バナー

お世話になってる無料写真シェアサイト
PIXELIO
時計、カウンター、謎
下のボタンを押すと変身! 左は時計、真ん中はカウンター、右は不思議なグローバーウォークが見られるよ。
Live on Earth
全世界の現在の閲覧者です
現在のブログ閲覧者数
日本ブログ村
Copyright ©  -- Germany Today --  All Rights Reserved

Design by CriCri / Material by 百花繚乱 / 
powered by NINJA TOOLS / 忍者ブログ / [PR]