2 - ol3.12ex 152b - WMS GetFeatureInfo (Layers) 2

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

「2152-ol3ex.js」

$.ajax({
/** jQuery.ajax( url [, settings ] )
 * Perform an asynchronous HTTP (Ajax) request.
 * 非同期HTTP（アヤックス）リクエストを実行します。
 * （jQuery[http://api.jquery.com/jquery.ajax/]）
 */

 // url: './data/wmsgetfeatureinfo/osm-restaurant-hotel.xml',
 url: 'v3.14.0/examples/data/wmsgetfeatureinfo/osm-restaurant-hotel.xml',
 /** url  Type: String
  * A string containing the URL to which the request is sent.
  * リクエストが送信される URL を含む文字列。
  * （jQuery[http://api.jquery.com/jquery.ajax/]）
  */

 success: function(response) {
 /** success  Type: Function( Anything data, String 
  * textStatus, jqXHR jqXHR ) 
  * A function to be called if the request succeeds. The 
  * function gets passed three arguments: The data returned 
  * from the server, formatted according to the dataType 
  * parameter or the dataFilter callback function, if 
  * specified; a string describing the status; and the jqXHR 
  * (in jQuery 1.4.x, XMLHttpRequest) object. As of jQuery 
  * 1.5, the success setting can accept an array of 
  * functions. Each function will be called in turn. This is 
  * an Ajax Event.
  * リクエストが成功した場合、関数は呼び出されます。この関数は3
  * つの引数が渡されます：指定される場合、dataType のパラメータ、
  * または、dataFilter callbach 関数に従ってフォーマットされ
  * た、サーバから返されるデータ; 状況を説明する文字列; そして、
  * jqXHR（jQuery 1.4.x の、XMLHttpRequest）オブジェクト、で
  * す。jQuery 1.5 のように、成功の設定は関数の配列を受け入れる
  * ことができます。各関数は順番に呼び出されます。これは Ajax 
  * Event です。
  * （jQuery[http://api.jquery.com/jquery.ajax/]）
  */

  // this is the standard way to read the features
  // これはフィーチャを読み込む標準的な方法です。

  var allFeatures = new ol.format.WMSGetFeatureInfo().readFeatures(response);
  /** ol.format.WMSGetFeatureInfo 
   * Format for reading WMSGetFeatureInfo format. It uses 
   * ol.format.GML2 to read features.
   * WMSGetFeatureInfo 形式を読み取るためのフォーマット。これ
   * は、フィーチャを読み取るためにol.format.GML2を使用してい
   * ます。
   * （ol3 API[説明は Stable Only のチェックを外すと表示]）
   */

  /** readFeatures(source, opt_options)
   * Read all features from a WMSGetFeatureInfo response.
   * WMS GetFeatureInfo 応答のすべてのフィーチャを読み込みます。
   * （ol3 API）
   */

  $('#all').html(allFeatures.length.toString());
  /** .html()
   * Get the HTML contents of the first element in the set 
   * of matched elements.
   * マッチした要素のセットの最初の要素のHTMLコンテンツを取得し
   * ます。
   * （jQuery[http://api.jquery.com/html/]）
   */

  /** Number.prototype.toString()
   * 指定された Number オブジェクトを表す 文字列を返します。
   * （MDN[https://developer.mozilla.org/ja/docs/Web/
   * JavaScript/Reference/Global_Objects/Number/toString]）
   */

  // when specifying the 'layers' options, only the 
  // features of those layers are returned by the format
  // 「layers」オプションを指定するときに、これらのレイヤのフィー
  // チャだけ、形式によって返されます

  var hotelFeatures = new ol.format.WMSGetFeatureInfo({

   layers: ['hotel']
   /** layers:
    * If set, only features of the given layers will be 
    * returned by the format when read.
    * 設定した場合、読み込まれたとき、与えられたレイヤのフィー
    * チャでだけ、フォーマットによって返されます。
   * （ol3 API[説明は Stable Only のチェックを外すと表示]）
    */

  }).readFeatures(response);
  $('#hotel').html(hotelFeatures.length.toString());

  var restaurantFeatures = new ol.format.WMSGetFeatureInfo({
   layers: ['restaurant']
  }).readFeatures(response);
  $('#restaurant').html(restaurantFeatures.length.toString());

 }
});