Google Street View Image API を使ってみる

この Web ページで行うこと．

Google Street View Image API を使ってストリートビューを表示してみる

準備

◆ JavaScript に関する Web ブラウザの設定

Internet Explorer
インターネットオプションの「セキュリティの設定」で，「スクリプト」→「アクティブ　スクリプトを有効にする」
Firefox
メニューのツール→オプション→Web 機能の設定

Google Street View Image API を使ってストリートビューを表示してみる

【関連する外部ページ】 https://developers.google.com/maps/documentation/streetview/?hl=ja

API キーの取得

https://code.google.com/apis/console で、Google アカウントでログイン
メニューの「Services」をクリック
「Street View Image API サービス」を「オン」にする

「Key for browser apps」のところに API キーが表示されるので確認する

HTML ファイルの例

キャラクタセット (character set): UTF-8
センサー (sensor): false
サイズ: 640x480
緯度: 33.59656025053064
経度: 130.21688103675842
heading(カメラの方向): 180 （北が９と３６０，東が９０，南が１８０、西が２７０）
fov(水平視野): 120　（最大 120 まで）

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "https://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
    <head>
        <meta http-equiv="Content-Type" content="text/html; initial-scale=1.0; charset=UTF-8" />
        <meta http-equiv="Content-Style-Type" content="text/css" />
        <meta http-equiv="Content-Script-Type" content="text/javascript" />
        <meta http-equiv="MSThemeCompatible" CONTENT="yes" />
        <title>Insert title here</title>
    </head>
<body>

<img src=//"maps.googleapis.com/maps/api/streetview?size=640x480&heading=180&fov=120&location=33.59656025053064, 130.21688103675842&sensor=false&key="＜API キー＞"> </a>

</body>
</html>