36 - GeoEXT を使用した WFS-T 7 - WMS GetFeatureInfo Popup

36-7 WMS GetFeatureInfo Popup
Developing OGC Compliant Web Applications with GeoExt の
2.4. Explore Map Features with a WMS GetFeatureInfo Popup（http://workshops.boundlessgeo.com/geoext/stores/getfeatureinfo.html）を参考に WMS レイヤの属性をポップアップ表示します。
続けて「ol017-nippon_bmi_akiruno_pgis.html」を使います。

---

<link rel="stylesheet" type="text/css" href="GeoExt/resources/css/geoext-all-debug.css" />
<link rel="stylesheet" type="text/css" href="GeoExt/resources/css/popup.css"><!-- 追加 -->
<script type="text/javascript" src="GeoExt/lib/GeoExt.js"></script>

<script type="text/javascript">
 OpenLayers.ProxyHost = "/cgi-bin/proxy.cgi?url="; // 追加

---
// ここから追加

 items.push({
  xtype: "gx_legendpanel",
  region: "east",
  width: 200,
  autoScroll: true,
  padding: 5
 });

  controls.push(new OpenLayers.Control.WMSGetFeatureInfo({
  autoActivate: true,
  infoFormat: "application/vnd.ogc.gml",
  maxFeatures: 3,
  eventListeners: {
   "getfeatureinfo": function(e) {
    var items = [];
    Ext.each(e.features, function(feature) {
     items.push({
      xtype: "propertygrid",
      title: feature.fid,
      source: feature.attributes
     });
    });

    new GeoExt.Popup({
     title: "Feature Info",
     width: 200,
     height: 200,
     layout: "accordion",
     map: app.mapPanel,
     location: e.xy,
     items: items
    }).show();
   }
  }
 }));

// ここまで
</script>
---