[OSGeoJapan-discuss] MapServerとOpenLayersのWMSの初期化時の拡大図
奈良崎 優
mnarazaki ＠ mpcnet.co.jp
2012年 5月 29日 (火) 20:10:47 PDT
皆様
申し訳ありません。
OpenLayersのzoomToScaleで、次のとおり設定すると、東京スカイツリーの押上1丁目付近の拡大図が得られました。
head 内の function init() の最後の map.addControl の次に、QGISから読んだスケール1000(m)を次のように追加。
map.zoomToScale(1000);
また、mapcenterの値を
var lon = 139.7245;
var lat = 35.6816;
に変更。
ただし、スケールバーが無く、本当に1000mになっているのかわからないので、
次のサイト（presented at FOSS4G 2011）を参考にしてscaleline（=スケールバー)を追加しました。
http://workshops.opengeo.org/openlayers-intro/controls/scaleline.html
このscalelineから読むと、横=4000mぐらいありそうです。
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
（質問)正確に1000mとするにはどうすればよいのでしょうか?
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
以下は、上の時のOpenLayersのソースです。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"/>
<link rel="stylesheet" href="style.css" type="text/css" />
<style type="text/css">
#map {
width: 800px;
height: 500px;
border: 1px solid black;
}
</style>
<script src="OpenLayers.js"></script>
<script type="text/javascript">
var lon = 139.81486;
var lat = 35.70971;
var zoom = 11;
var map, layer;
var scaleline;
function init(){
map = new OpenLayers.Map( 'map' );
localWMS = new OpenLayers.Layer.WMS( "Local WMS layers",
"http://127.0.0.1/cgi-bin/mapserv.exe?MAP=C:/MS4W/apps/mapserver-tutorial/example12/example_initpos.map",
{layers: 'mapserver_tutorial_wms_server', transparent: true}, {isBaseLayer: true} );
map.addLayer(localWMS);
scaleline = new OpenLayers.Control.ScaleLine();
map.addControl(scaleline);
map.setCenter(new OpenLayers.LonLat(lon, lat), zoom);
map.addControl( new OpenLayers.Control.LayerSwitcher() );
map.zoomToScale(1000);
}
</script>
</head>
<body onload="init()">
<h1 id="title">OpenLayers Example</h1>
<div id="tags">
</div>
<p id="shortdesc">
Shows the basic use of OpenLayers with our local WMS layers and a GeoGrid WMS layer.
</p>
<div id="map" class="smallmap"></div>
<div id="docs">
OpenLayers is a JavaScript file (OpenLayers.js) that can be easily included in any HTML file.<br>Click on the source
below to see the few lines required to add these 2 WMS servers into the map.<br>
<br>
<hr noshade width="40%" size="1" align="left">
<a href="/mapserver-tutorial/example14/openlayers_source.html">- (source) -</a>
<a href="/mapserver-tutorial/index.html">- (back) -</a>
</div>
</body>
</html>
奈良崎
奈良崎 優 さんは書きました:
>皆様
>OSGeo4WのMapServerの例題をverion=6.0で色々変更してWeb-GISの勉強しています。
>例題14は、東京のMapServerとOpenLayersのWMSの例題です。
>初期化時に、東京スカイツリーのある押上1丁目付近の拡大図を表示させ、次第に表示エリアを拡張したいと思い、
>mapファイルのEXTENTの値を次のとおり変更しました。
>（この値は、QGISで読みました。)
> min max min max
>(139.72520,35.67139）,(139.78845,35.7073）−＞（139.7944,35.68858）,（139.84025,35.72974）
>しかし、何の変化もありません。
>OpenLayersのzoomToExtentで制御するのでしょうか?
>もしそうなら、わかりやすい例題を紹介していただけないでしょうか?
>（APIの説明だけだと初心者にはわかりづらいのでexampleがついたものがいいです。)
>以下に、使用したMapファイルとOpenlayersのhtmlファイルを示します。
>（ほぼ、OSGeo4Wの例題14と同じで、相違点は、v=6.0にしたためです。)
>よろしくお願いします。
> 奈良崎
>１．Mapファイル
>MAP
> NAME "mapserver_tutorial_wms_server"
> IMAGETYPE PNG
> EXTENT 139.7944 35.68858 139.84025 35.72974
> #EXTENT 139.72520 35.67139 139.78845 35.7073
> SIZE 550 450
>
> IMAGECOLOR 255 255 255
> SHAPEPATH "../data"
>
> FONTSET ../fonts/fonts.txt
>
> UNITS dd
>
> WEB
> TEMPLATE 'example_template.html'
> IMAGEPATH "C:\MS4W/tmp/ms_tmp/"
> IMAGEURL "/ms_tmp/"
> #MINSCALEDENOM 100
> MINSCALEDENOM 1000
> #MAXSCALEDENOM 70000
> MAXSCALEDENOM 700000
> METADATA
> "wms_title" "MapServer Tutorial WMS Server"
> "wms_onlineresource" "http://127.0.0.1/cgi-bin/mapserv.exe?MAP=C:\MS4W/apps/mapserver-tutorial/example12/example_initpos.map"
> "wms_srs" "EPSG:4301 EPSG:4269 EPSG:4326"
> "wms_abstract" "This demonstration server shows how to setup a MapServer .map file to serve data through the WMS standard."
> wms_enable_request "*"
> END
> #"wms_enable_request" "*"
> END
>
> PROJECTION
> "init=epsg:4301"
> END
>
> LAYER
> NAME "roads"
> METADATA
> "wms_title" "Roads"
> END
> DATA dourokukan
> STATUS ON
> TYPE LINE
> MAXSCALEDENOM 50000
> CLASS
> NAME "roads"
> STYLE
> COLOR 187 187 127
> END
> END
> PROJECTION
> "init=epsg:4301"
> END
> END
>
> LAYER
> NAME "administrative"
> METADATA
> "wms_title" "Administrative"
> END
> DATA gyouseikai
> STATUS ON
> TYPE LINE
> CLASS
> NAME "Administrative"
> STYLE
> COLOR 227 127 227
> END
> END
> PROJECTION
> "init=epsg:4301"
> END
> END
>
> LAYER
> NAME "rail"
> METADATA
> "wms_title" "Rail"
> END
> DATA tetsudokukan
> STATUS ON
> TYPE LINE
> CLASS
> NAME "Rail"
> STYLE
> COLOR 128 128 128
> END
> END
> PROJECTION
> "init=epsg:4301"
> END
> END
>
> LAYER
> NAME "rivers"
> METADATA
> "wms_title" "Rivers"
> END
> DATA kasenkukan
> STATUS ON
> TYPE LINE
> CLASS
> NAME "Rivers"
> STYLE
> COLOR 0 255 255
> END
> END
> PROJECTION
> "init=epsg:4301"
> END
> END
>
> LAYER
> NAME "water"
> METADATA
> "wms_title" "Water"
> END
> DATA suiikikai
> STATUS ON
> TYPE LINE
> CLASS
> NAME "Water"
> STYLE
> COLOR 0 0 255
> END
> END
> PROJECTION
> "init=epsg:4301"
> END
> END
>
> LAYER
> NAME "places"
> METADATA
> "wms_title" "Place name"
> END
> DATA chimei
> STATUS ON
> TYPE POINT
> LABELITEM "NAMAE"
> CLASS
> NAME "Places"
> STYLE
> COLOR 10 100 100
> END
> LABEL
> TYPE TRUETYPE
> FONT pgothic
> COLOR 220 20 20
> SIZE 7
> POSITION CL
> PARTIALS FALSE
> BUFFER 5
> ENCODING "SHIFT_JIS"
> END
> END
> PROJECTION
> "init=epsg:4301"
> END
> END
>
>END
>
>２．Openlayersのhtmlファイル
><html xmlns="http://www.w3.org/1999/xhtml">
> <head>
> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"/>
> <link rel="stylesheet" href="style.css" type="text/css" />
> <style type="text/css">
> #map {
> width: 800px;
> height: 500px;
> border: 1px solid black;
> }
> </style>
> <script src="OpenLayers.js"></script>
> <script type="text/javascript">
> var lon = 139.7245;
> var lat = 35.6816;
> var zoom = 11;
> var map, layer;
>
> function init(){
> map = new OpenLayers.Map( 'map' );
>
> localWMS = new OpenLayers.Layer.WMS( "Local WMS layers",
> "http://127.0.0.1/cgi-bin/mapserv.exe?MAP=C:/MS4W/apps/mapserver-tutorial/example12/example_initpos.map",
> {layers: 'mapserver_tutorial_wms_server', transparent: true}, {isBaseLayer: true} );
> map.addLayer(localWMS);
>
> map.setCenter(new OpenLayers.LonLat(lon, lat), zoom);
> map.addControl( new OpenLayers.Control.LayerSwitcher() );
> }
> </script>
> </head>
> <body onload="init()">
> <h1 id="title">OpenLayers Example</h1>
>
> <div id="tags">
> </div>
> <p id="shortdesc">
> Shows the basic use of OpenLayers with our local WMS layers and a GeoGrid WMS layer.
> </p>
>
> <div id="map" class="smallmap"></div>
>
> <div id="docs">
> OpenLayers is a JavaScript file (OpenLayers.js) that can be easily included in any HTML file.<br>Click on the source
> below to see the few lines required to add these 2 WMS servers into the map.<br>
> <br>
> <hr noshade width="40%" size="1" align="left">
> <a href="/mapserver-tutorial/example14/openlayers_source.html">- (source) -</a>
> <a href="/mapserver-tutorial/index.html">- (back) -</a>
> </div>
> </body>
></html>
>
>********************************************************************************
> 〒247-8505
> 鎌倉市上町屋345番地
> 三菱プレシジョン株式会社
> 生産管理部
> 奈良崎 優 Narazaki Masaru
> Tel 0467-42-5547
> e-mail:mnarazaki ＠ mpcnet.co.jp
>********************************************************************************
>
>______________________________________________________________________
>
>_______________________________________________
>OSGeoJapan-discuss mailing list
>OSGeoJapan-discuss ＠ lists.osgeo.org
>http://lists.osgeo.org/mailman/listinfo/osgeojapan-discuss
More information about the OSGeoJapan-discuss
mailing list