OpenLayers 7units metersのWMS

kamakura_pgis.mapとkanagawa_pgis.mapでWMS （Web Map Service）を使ってみます。

最初に、MapServerにWMSサーバとしての設定をします。
WEB オブジェクトに WMS サーバ機能を利用可能にする設定をします。

user@debian:~$ vim mapfile/kamakura_pgis.map

MAP
 NAME kamakura_pgis_map
---

 WEB
   IMAGEPATH "/home/user/ka-map/htdocs/tmp/kacache/"
   IMAGEURL "/ka-map/tmp/kacache/"
   METADATA
     "wms_title" "Kamakura Map WMS Server" # 追加
   END
 END
--

chojisen の LAYER オブジェクトを修正します。

 LAYER
   NAME chojisen
   GROUP chojisen
   TYPE LINE
   STATUS ON # WMSクライアントで表示・非表示を操作できるように ON にします。
   CONNECTIONTYPE POSTGIS
   CONNECTION "dbname=kamakura host=localhost user=user password=password"
   DATA "the_geom from chojisen"
   MINSCALE 1000       # 不適当な縮尺で使用されないようにします。
   MAXSCALE 1000000000 # 同上
   METADATA
     "group_title" "町字界線"
     "wms_title" "choji_kaisen" # 追加
   END
   CLASS
     NAME "町字界線"
     STYLE
       COLOR 51 51 51
       SIZE 1
     END
   END
 END

kanagawa_pgis.map を修正します。

MAP
 NAME kanagawa_pgis_map
---
 WEB
   IMAGEPATH "/home/user/ka-map/htdocs/tmp/kacache/"
   IMAGEURL "/ka-map/tmp/kacache/"
   METADATA
     "wms_title" "Kanagawa Map WMS Server" # 追加
   END
 END
---

kukaku の LAYER オブジェクトを修正します。

 LAYER
   NAME kukaku
   GROUP kukaku
   TYPE POLYGON
   STATUS ON # WMSクライアントで表示・非表示を操作できるように ON にします。
   CONNECTIONTYPE POSTGIS
   CONNECTION "dbname=kanagawa host=localhost user=user password=password"
   DATA "the_geom from gyoseikukaku"
   MINSCALE 1000       # 不適当な縮尺で使用されないようにします。
   MAXSCALE 1000000000 # 同上
   METADATA
     "group_title" "行政区画"
     "wms_title" "kukaku" # 追加
   END
   CLASS
     NAME "行政区画"
     STYLE
       COLOR 255 255 204
       OUTLINECOLOR 204 204 204
     END
   END
 END
---

Eclipse を起動して Example フォルダないの wms.html をコピーして wms_meters.html ファイルを作成します。
0 wms.htmlをダブルクリックして開きます。
1 プロジェクトビューのOpenLayersprojフォルダを右クリックして、新規->HTMLファイルをクリックします。
2 HTMLファイルウィンドウでファイル名をwms_meters.htmlと入力し、終了ボタンをクリックします。
3 エディタのタブをエディタビュー内の下へドラッグすると2段になってみやすくなります。
4 charsetをUTF-8にして、<title>をWMS Units Meters Mapにします。
5 wms.html の内容ををコピーしてwms_meters.html ファイルに貼り付けます。
6 javascriptの一部を次のように修正します。
style.cssとOpenLayers.jsのパスを変えます。
OpenLayers.Map のオプションに
maxResolution: 'auto',
units: 'meters',
maxExtent: new OpenLayers.Bounds(-83624.557161,-96269.254733,-3366.679476,-36305.074927)
を追加します。

---
<link rel="stylesheet" href="./theme/default/style.css" type="text/css" />
---
<script src="./lib/OpenLayers.js"></script>
---
<script type="text/javascript">
 var map, layer1, layer2;
 function init(){
   map = new OpenLayers.Map('map',  {
     maxResolution: 'auto',
     units: 'meters',
     maxExtent: new OpenLayers.Bounds(-83624.557161,-96269.254733,-3366.679476,-36305.074927)
     }
   );
 layer1 = new OpenLayers.Layer.WMS( "Kamakura Chojikai Sen WMS",
    "http://localhost/cgi-bin/mapserv?",
  {
    map: '/home/user/mapfile/kamakura_pgis.map',
    layers: 'chojisen',
    transparent: true,
    format: 'image/png'
  },
  {
    projection: 'EPSG:2451'
  }
 );

 layer2 = new OpenLayers.Layer.WMS( "Kanagawa Gyosei Kukaku Sen WMS",
    "http://localhost/cgi-bin/mapserv?",
  {
     map: '/home/user/mapfile/kanagawa_pgis.map',
    layers: 'kukaku',
    format: 'image/png'
  },
  {
    projection: 'EPSG:2451'
  }
 );
 map.addLayers([layer1, layer2]);
 map.addControl(new OpenLayers.Control.LayerSwitcher());
 map.zoomToMaxExtent();
 }
</script>
---

7 エディタのデフォルトタブをクリックします。