2 - ol3.14ex 151b - Full Screen Control with extended source element 2

「full-screen-source.js（2151-ol3ex.js）」は、マップを表示するための JavaScript ファイルです。

「2151-ol3ex.js」

var view = new ol.View({
 center: [-9101767, 2822912],
 zoom: 14
});

var map = new ol.Map({

 controls: ol.control.defaults().extend([
 /** controls
  * Controls initially added to the map. 
  * If not specified, ol.control.defaults() is used.
  * 初期設定で、マップに追加されたコントロール。
  * 明示されていなければ、ol.control.defaults() が使用されます。
  * （ol3 API）
  */

 /** ol.control.defaults()
  * Set of controls included in maps by default. 
  * Unless configured otherwise, this returns a 
  * collection containing an instance of each of the 
  * following controls:
  * ol.control.Zoom, ol.control.Rotate, 
  * ol.control.Attribution
  * デフォルトでは、マップに含まコントロールのセット。
  * 特に設定しない限り、これは、以下の各コントロールの
  * インスタンスを含むコレクションを返します。(ol3 API）
  */

  new ol.control.FullScreen({
  /**ol.control.FullScreen
   * Provides a button that when clicked fills up the 
   * full screen with the map. The full screen source 
   * element is by default the element containing the 
   * map viewport unless overriden by providing the 
   * source option. In which case, the dom element 
   * introduced using this parameter will be displayed 
   * in full screen.
   * When in full screen mode, a close button is shown 
   * to exit full screen mode. The Fullscreen API is 
   * used to toggle the map in full screen mode.
   * クリックされたとき、マップと共にフルスクリーンにするボタ
   * ンを提供します。フルスクリーンソース要素は、デフォルトで
   * は、ソースのオプションを提供することによって上書きされな
   * い限り、マップビューポートを含む要素です。その場合には、
   * このパラメータを使用して導入されたDOM要素は、フルスク
   * リーンで表示されます。
   * フルスクリーンモードで、閉じるボタンは、
   * フルスクリーンモードを終了するように示されています。フル
   * スクリーン API は、フルスクリーンモードでマップを切り替
   * えるために使用されます。（ol3 API）
   */

   source: 'fullscreen'
   /** source:
    * The element to be displayed fullscreen. When not 
    * provided, the element containing the map viewport 
    * will be displayed fullscreen.
    * 全画面を表示する要素。提供されていない場合には、マップ
    * ビューポートを含む要素がフルスクリーン表示されます。
    * （ol3 API[説明は Stable Only のチェックを外すと表示]）
    */

  })
 ]),
 layers: [

  new ol.layer.Tile({
  /** ol.layer.Tile 
   * For layer sources that provide pre-rendered, tiled 
   * images in grids that are organized by zoom levels 
   * for specific resolutions. 
   * プリレンダリング（事前描画）を提供するレイヤソースのため
   * の、特定の解像度でのズームレベルによって編成されているグ
   * リッドのタイルイメージ。（ol3 API）
   */

   source: new ol.source.OSM()
   /** source:
    * Source for this layer. Required.（ol3 API）
     */

   /** ol.source.OSM 
    * Layer source for the OpenStreetMap tile server.
    * OpenStreetMap タイルサーバのレイヤソース。（ol3 API）
    */

  })
 ],

 renderer: common.getRendererFromQueryString(),
// 'common.js' により URL にある renderer を返します

 target: 'map',
 view: view
});