◆準備作業等

1. Yahoo! map API を利用するには、利用ガイドに従う必要があります。
2. Yahoo! map API で地図表示にはアプリケーションIDが必要です
   Yahoo! mapに貼り付けるアプリケーションIDを取得(無料)します。
   Yahoo! JAPAN IDがない場合は、Yahoo! JAPAN IDの取得からする必要があります。
3. Yahoo! mapを表示するときはクレジットを表示する必要があります。

◆Yahoo!Map JS v1を表示してみる

• 地図表示の基本　参考
  1. APIを読み込む
     Yahoo!地図WebサービスのJavaScriptファイルをインクルードします。
     【APPID】の部分は、取得した（アプリケーションID）に置き換えます。 <script type="text/javascript" charset="utf-8" src="https://map.yahooapis.jp/js/V1/jsapi?appid=【APPID】"></script>
  2. 地図の埋め込み
     HTML文書の地図表示箇所に、下の例のようにdiv要素などにid属性を設けて指定します。
     id属性には任意の文字列（ここでは"map"）を指定します。このIDで読み込む箇所を識別します。
     要素のstyle属性でwidth（幅）とheight（高さ）をそれぞれ指定して地図の大きさを決めます。
     <div id="map" style="width:300px; height:250px"></div>
  3. 地図を表示する
     JavaScriptマップAPIのメインとなるのはY.Mapオブジェクトです。
     Y.Mapをnewすることで地図が初期化して、任意変数（ここではymap）に格納します。
     　・引数（idパラメータ）には、要素にid属性で指定した文字列（ここでは"map"）を指定します。
     　初期化した地図を表示するには、Y.MapオブジェクトのdrawMap()メソッドを使用します。
     drawMap()メソッドには3つの引数が渡せます。順に、
     　・中心の緯度経度(必須:測地系について)
     　　例: new Y.LatLng(35.69081,139.69992) 　　　
     注. 緯度(,経度)は小数点以下 5桁目が 1m程度の分解能になります
     　・ズームレベル　(標準地図では1～20を指定、詳細ほど数値が大きくなります)
     　・レイヤーセットIDで、表示する地図の種類を変更できます。
     

     レイヤーセットID	種　類	ズームレベル
     Y.LayerSetId.NORMAL	標準地図	1～20
     Y.LayerSetId.PHOTO	航空写真	1～21
     Y.LayerSetId.B1	地下街	19～21

     　これらを合わせて書くと、次のようになります。 var ymap = new Y.Map("map"); ymap.drawMap(new Y.LatLng(35.6908,139.6999),15,Y.LayerSetId.NORMAL);
     　＊drawBounds() メソッドは表示範囲を Y.LatLngBounds で指定します。その際、縮尺は自動選択されます。 ymap.drawBounds(new Y.LatLngBounds(new Y.LatLng(35.696,139.690),new Y.LatLng(35.681,139.715)),Y.LayerSetId.NORMAL);
  4. クレジットを表示する
     Yahoo Maps API の利用ガイド にあるように、Yahoo Maps API を使って地図を表示するときは、 クレジットを表示 しなければなりません。
     　要請に従った次のようなクレジットを付け加えます。 <a href="https://developer.yahoo.co.jp/about"> <img src="https://i.yimg.jp/images/yjdn/yjdn_attbtn2_105_17.gif" width="105" height="17" title="Webサービス by Yahoo! JAPAN" border="0" style="margin:4px 25px 15px 15px;float:left;"></a>