「Mobile Drawing（mobile-drawing.html）」を参考に、モバイル機器で使用する編集ツールバーを追加します。
同じように「mobile_drawing.js」を開きます。
f 「mobile-drawing.html」の内容をコピーして「ol019d-nippon_bmi_takata_pgis.html」に貼り付け、修正します。
g 同じように、新規に「mobile-drawing_takata.js」ファイルを作成し、「File Template」ウィンドウで「JavaScript Template」をクリックして選択し、「完了」ボタンをクリックして、「mobile-drawing.js」の内容をコピーして貼り付け、修正します。
「ol019d-nippon_bmi_takata_pgis.html
<!DOCTYPE html> <html> <head> <title>OpenLayers Mobile Drawing(R.Takata)</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> <meta name="apple-mobile-web-app-capable" content="yes">
<!-- 追加 --> <script src="OpenLayers-2.13.1/lib/proj4js/lib/proj4js.js"></script> <script src="OpenLayers-2.13.1/lib/proj4js/lib/proj4js-combined.js"></script> <script src="OpenLayers-2.13.1/lib/proj4js/lib/defs/EPSG2452.js"></script> <!-- 追加ここまで -->
<!-- 修正 --> <link rel="stylesheet" href="OpenLayers-2.13.1/theme/default/style.css" type="text/css"> <link rel="stylesheet" href="OpenLayers-2.13.1/theme/default/style.mobile.css" type="text/css" /> <script type="text/javascript" src="OpenLayers-2.13.1/lib/OpenLayers.js?mobile"></script> <script src="mobile-drawing_takata.js"></script> <!-- 修正ここまで --> <style>---
「mobile-drawing_takata.js」
var bounds = new OpenLayers.Bounds(55000,-121000,78000,-97000); // 追加
function init() {
---
/* var osm = new OpenLayers.Layer.OSM(); osm.wrapDateLine = false; */
map = new OpenLayers.Map({
div: 'map',
// projection: 'EPSG:900913',
// numZoomLevels: 18,
// ここから追加
projection: new OpenLayers.Projection("EPSG:2452"),
displayProjection: new OpenLayers.Projection("EPSG:4326"),
maxResolution: 'auto',
units: 'meters',
maxExtent: bounds,
restrictedExtent: bounds.clone(),
// ここまで
controls: [
new OpenLayers.Control.TouchNavigation({
dragPanOptions: {
enableKinetic: true
}
}),
new OpenLayers.Control.Zoom(),
toolbar
],
// layers: [osm, vector],
// ここから追加
layers: [
new OpenLayers.Layer.WMS( "R.Takata Height WMS",
"http://192.168.1.200:8080/geoserver/wms",
{
layers: 'npn:rikuzentakata5m-epsg2452'
},{
isBaselayer: true
}),
new OpenLayers.Layer.WMS( "Iwate Kuiki WMS",
"http://192.168.1.200:8080/geoserver/wms",
{
layers: 'npn:iwate_kuiki',
transparent: true,
format: 'image/png'
},{
isBaselayer: false
}),
new OpenLayers.Layer.WMS( "R.Takata Kukakusen WMS",
"http://192.168.1.200:8080/geoserver/wms",
{
layers: 'npn:rikuzentakata_kukakusen',
transparent: true,
format: 'image/png'
},{
isBaselayer: false
}),
new OpenLayers.Layer.WMS( "R.Takata Choaza WMS",
"http://192.168.1.200:8080/geoserver/wms",
{
layers: 'npn:rikuzentakata_choaza',
transparent: true,
format: 'image/png'
},{
isBaselayer: false
}),
new OpenLayers.Layer.WMS( "R.Takata Kaigan WMS",
"http://192.168.1.200:8080/geoserver/wms",
{
layers: 'npn:rikuzentakata_kaigan',
transparent: true,
format: 'image/png'
},{
isBaselayer: false
}),
new OpenLayers.Layer.WMS( "R.Takata Suigai WMS",
"http://192.168.1.200:8080/geoserver/wms",
{
layers: 'npn:rikuzentakata_suigai',
transparent: true,
format: 'image/png'
},{
isBaselayer: false
}),
new OpenLayers.Layer.WMS( "R.Takata Suiiki WMS",
"http://192.168.1.200:8080/geoserver/wms",
{
layers: 'npn:rikuzentakata_suiiki',
transparent: true,
format: 'image/png'
},{
isBaselayer: false
}),
new OpenLayers.Layer.WMS( "R.Takata Suikozo WMS",
"http://192.168.1.200:8080/geoserver/wms",
{
layers: 'npn:rikuzentakata_suikozo',
transparent: true,
format: 'image/png'
},{
isBaselayer: false
}),
new OpenLayers.Layer.WMS( "R.Takata Doro WMS",
"http://192.168.1.200:8080/geoserver/wms",
{
layers: 'npn:rikuzentakata_doro',
transparent: true,
format: 'image/png'
},{
isBaselayer: false
}),
new OpenLayers.Layer.WMS( "R.Takata Dorokozo WMS",
"http://192.168.1.200:8080/geoserver/wms",
{
layers: 'npn:rikuzentakata_dorokozo',
transparent: true,
format: 'image/png'
},{
isBaselayer: false
}),
new OpenLayers.Layer.WMS( "R.Takata Kido WMS",
"http://192.168.1.200:8080/geoserver/wms",
{
layers: 'npn:rikuzentakata_kido',
transparent: true,
format: 'image/png'
},{
isBaselayer: false
}),
new OpenLayers.Layer.WMS( "R.Takata Kenchiku WMS",
"http://192.168.1.200:8080/geoserver/wms",
{
layers: 'npn:rikuzentakata_kenchiku',
transparent: true,
format: 'image/png'
},{
isBaselayer: false
}),
new OpenLayers.Layer.WMS( "Iwate Public Facilities WMS",
"http://192.168.1.200:8080/geoserver/wms",
layers: 'npn:iwate_pf',
transparent: true,
format: 'image/png'
},{
isBaselayer: false
}),
vector
],
// 追加ここまで
// center: new OpenLayers.LonLat(0, 0), // zoom: 1, center: bounds.getCenterLonLat(), // 修正 zoom: 0, theme: null });
// activate the first control to render the "navigation icon" // as active toolbar.controls[0].activate(); }
