WMS GetFeatureInfo (Layers)——WMS獲取要素資訊（圖層）
阿新 • • 發佈：2019-01-01
Demonstrates the use of the
layers option in the
ol.format.WMSGetFeatureInfo format object, which allows features returned by a single WMS GetFeatureInfo request that asks for more than one layer to be read by layer name.
在ol.format.WMSGetFeatureInfo格式物件中演示layers設定的使用，這允許要素返回單個WMS GetFeatureInfo請求，這個請求可以通過圖層的名稱來訪問多個圖層。
程式碼：
<!DOCTYPE html> <html> <head> <title>WMS GetFeatureInfo (Layers)</title> <link rel="stylesheet" href="https://openlayers.org/en/v4.2.0/css/ol.css" type="text/css"> <!-- The line below is only needed for old environments like Internet Explorer and Android 4.x --> <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL"></script> <script src="https://openlayers.org/en/v4.2.0/build/ol.js"></script> </head> <body> <table id="info"> <tr> <td>All features:</td> <td id="all"></td> </tr> <tr> <td>Hotel features:</td> <td id="hotel"></td> </tr> <tr> <td>Restaurant features:</td> <td id="restaurant"></td> </tr> </table> <script> // 獲取請求 fetch('https://openlayers.org/en/v4.2.0/examples/data/wmsgetfeatureinfo/osm-restaurant-hotel.xml').then(function(response) { return response.text(); }).then(function(response) { // this is the standard way to read the features // 標準的方式來讀取要素 // 返回所有要素 var allFeatures = new ol.format.WMSGetFeatureInfo().readFeatures(response); document.getElementById('all').innerText = allFeatures.length.toString(); // when specifying the 'layers' options, only the features of those // layers are returned by the format // 當指定了layer設定的時候，只有這些圖層的要素按照格式返回 // 返回hotel圖層的要素 var hotelFeatures = new ol.format.WMSGetFeatureInfo({ layers: ['hotel'] }).readFeatures(response); document.getElementById('hotel').innerText = hotelFeatures.length.toString(); // 返回restaurant圖層的要素 var restaurantFeatures = new ol.format.WMSGetFeatureInfo({ layers: ['restaurant'] }).readFeatures(response); document.getElementById('restaurant').innerText = restaurantFeatures.length.toString(); }); </script> </body> </html>