Debianでka-MapのメモプラスOpenLayers とGeoExt: 2 - ol3.4ex 112b - Tiled WMS with custom projection example 2

「wms-custom-proj.js（2112-ol3ex.js）」は、マップを表示するための JavaScript ファイルです。

「2112-ol3ex.js」

/** By default OpenLayers does not know about the EPSG:21781 
 * (Swiss) projection. So we create a projection instance 
 * for EPSG:21781 and pass it to ol.proj.addProjection to 
 * make it available to the library for lookup by its code.
 * デフォルトで、OpenLayersは EPSG：21781（スイス）投影につい
 * てわかりません。そのため、EPSG：21781 投影インスタンスを作
 * 成し、そのコードによる検索のためのライブラリが利用できるよ
 * うにするために old.proj.addProjection にそれを渡します。
 */

var projection = new ol.proj.Projection({
/** ol.proj.Projection
 * Projection definition class. One of these is created 
 * for each projection supported in the application and 
 * stored in the ol.proj namespace. You can use these in 
 * applications, but this is not required, as API params 
 * and options use ol.proj.ProjectionLike which means the 
 * simple string code will suffice.
 * 投影定義クラス。これらの一つは、アプリケーションでサポートさ
 * れ、ol.proj名前空間に格納されている各投影に対して作成されま
 * す。アプリケーションでこれらを使用することができますが、API 
 * のパラメータとオプションは、単純な文字列コードが有能であるこ
 * とを意味する ol.proj.ProjectionLike を使用するので、これは
 * 必要ありません。（ol3 API）
 */

 code: 'EPSG:21781',
 /** The extent is used to determine zoom level 0. 
  * Recommended values for a projection's validity extent 
  * can be found at http://epsg.io/.
  * 範囲は、ズームレベル 0 を決定するために使用されます。投
  * 影の有効範囲の推奨値は、http://epsg.io/ で見つけること
  * ができます。
  */

 /** code
  * The SRS identifier code, e.g. EPSG:4326.（ol3 API）
  */

 extent: [485869.5728, 76443.1884, 837076.5648, 299941.7864],

 units: 'm'
 /** units
  * Units. Required unless a proj4 projection is defined 
  * for code.
  * units。もし、proj4 プロジェクションがコードとして定義され
  * ていなければ必要です。（ol3 API）
  */

});

ol.proj.addProjection(projection);
/** ol.proj.addProjection(projection)
 * Add a Projection object to the list of supported 
 * projections that can be looked up by their code.
 * コードによって検索することができるサポートされた投影のリ
 * ストに投影オブジェクトを追加します。（ol3 API）
 */

/** We also declare EPSG:21781/EPSG:4326 transform 
 * functions. These functions are necessary for the 
 * ScaleLine control and when calling 
 * ol.proj.transform for setting the view's initial 
 * center (see below).
 * EPSG:21781/ EPSG:4326 変換関数を同じように宣言します。
 * これらの関数は、ScaleLine コントロールと、ビューの初期
 * の中心を設定する ol.proj.transform　呼び出すときに必要
 * です（下記参照）。
 */

ol.proj.addCoordinateTransforms('EPSG:4326', projection,
/** ol.proj.addCoordinateTransforms(source, destination, 
 * forward, inverse)
 * Registers coordinate transform functions to convert 
 * coordinates between the source projection and the 
 * destination projection. The forward and inverse 
 * functions convert coordinate pairs; this function 
 * converts these into the functions used internally 
 * which also handle extents and coordinate arrays.
 * ソース投影と送信先投影との間で座標を変換するため関数を座標
 * 変換を登録します。順方向と逆方向の関数は、座標対を変換しま
 * す。この関数は、これらを範囲と座標配列も処理する内部的に使
 * 用される関数に変換します。（ol3 API）
 */

 function(coordinate) {
  return [
   WGStoCHy(coordinate[1], coordinate[0]),
   WGStoCHx(coordinate[1], coordinate[0])
  ];
 },
 function(coordinate) {
  return [
   CHtoWGSlng(coordinate[0], coordinate[1]),
   CHtoWGSlat(coordinate[0], coordinate[1])
  ];
});

var extent = [420000, 30000, 900000, 350000];

var layers = [
 new ol.layer.Tile({
  extent: extent,

  source: new ol.source.TileWMS({
  /** ol.source.TileWMS
   * Layer source for tile data from WMS servers.
   * WMS サーバからのタイルデータのレイヤソース。
   * （ol3 API）
   */

   url: 'http://wms.geo.admin.ch/',

   crossOrigin: 'anonymous',
   /** crossOrigin
    * The crossOrigin attribute for loaded images. Note 
    * that you must provide a crossOrigin value if you 
    * are using the WebGL renderer or if you want to 
    * access pixel data with the Canvas renderer. See 
    * https://developer.mozilla.org/en-US/docs/Web/HTML/
    * CORS_enabled_image for more detail.
    * ロードされたイメージの crossOrigin属性。WebGLのレンダ
    * ラーを使用している場合、または、キャンバスレンダラでピ
    * クセルデータにアクセスする場合、crossOrigin 値を提供な
    * ければならないことに注意してください。詳細は 
    * https://developer.mozilla.org/en-US/docs/Web/HTML/
    * CORS_enabled_image を参照してください。（ol3 API）
    */

   attributions: [new ol.Attribution({
   /** ol.Attribution
    * An attribution for a layer source.
    * レイヤソースの属性（ol3 API）
    */

   html: '&copy; ' +
    '<a href="http://www.geo.admin.ch/internet/geoportal/' +
    'en/home.html">' +
    'Pixelmap 1:1000000 / geo.admin.ch</a>'

   })],

   params: {
    'LAYERS': 'ch.swisstopo.pixelkarte-farbe-pk1000.noscale',
    'FORMAT': 'image/jpeg'
   },

   serverType: 'mapserver'
  })
 }),

 new ol.layer.Tile({
  extent: extent,
  source: new ol.source.TileWMS({
   url: 'http://wms.geo.admin.ch/',
   crossOrigin: 'anonymous',
   attributions: [new ol.Attribution({

    html: '&copy; ' +
     '<a href="http://www.geo.admin.ch/internet/geoportal/' +
     'en/home.html">' +
     'National parks / geo.admin.ch</a>'

   })],

   params: {'LAYERS': 'ch.bafu.schutzgebiete-paerke_nationaler_bedeutung'},

   serverType: 'mapserver'
  })
 })
];

var map = new ol.Map({

 controls: ol.control.defaults().extend([
 /** controls
  * Controls initially added to the map. 
  * If not specified, ol.control.defaults() is used.
  * 初期設定で、マップに追加されたコントロール。
  * 明示されていなければ、ol.control.defaults() が使用されます。
  * （ol3 API）
  */

 /** ol.control.defaults()
  * デフォルトでは、マップに含まコントロールのセット。
  * 特に設定しない限り、これは、以下の各コントロールの
  * インスタンスを含むコレクションを返します。(ol3 API）
  * ol.control.Zoom, ol.control.Rotate, ol.control.Attribution
  */

  new ol.control.ScaleLine({
  /** ol.control.ScaleLine
   * A control displaying rough x-axis distances, calculated 
   * for the center of the viewport. No scale line will be 
   * shown when the x-axis distance cannot be calculated in 
   * the view projection (e.g. at or beyond the poles in 
   * EPSG:4326). By default the scale line will show in the 
   * bottom left portion of the map, but this can be changed 
   * by using the css selector .ol-scale-line.
   * 粗いx軸の距離を表示するコントロール、ビューポートの中心に
   * 対して計算します。 x軸距離がビュー投影（例えば、
   * EPSG：4326 の極で、または、超えて）で計算することができ
   * ないときにスケールラインは表示されません。デフォルトでは、
   * スケールラインがマップの左下部分に表示されますが、これは 
   * CSSセレクタ .ol-scale-line を使用して変更することが
   * できます。（ol3 API）
   */

   units: 'metric'
  })
 ]),
 layers: layers,
 renderer: exampleNS.getRendererFromQueryString(),
 // 'example-behavior.js' により URL にある renderer を返します
 target: 'map',
 view: new ol.View({
  projection: projection,

  center: ol.proj.transform([8.23, 46.86], 'EPSG:4326', 'EPSG:21781'),

  extent: extent,
  zoom: 2
 })
});

/*
 * Swiss projection transform functions downloaded from
 * http://www.swisstopo.admin.ch/internet/swisstopo/en/home/
 * products/software/products/skripts.html
 * （上記サイトに JavaScript のコードファイルがあります。説明が
 * 次のようにあります。
 * Scripts for WGS84-LV03
 * swisstopo created some script examples allowing to 
 * calculate the Swiss projection. This allows you to 
 * convert WGS84 coordinates to CH1903/LV03 or vice versa.
 * swisstopo は、スイスの投影法を計算するいくつかのスクリプトサ
 * ンプルを作成しました。これは、WGS84 座標を CH1903/LV03 へ、
 * または、その逆に変換します。）
 */

// Convert WGS lat/long (° dec) to CH y
function WGStoCHy(lat, lng) {

 // Converts degrees dec to sex
 lat = DECtoSEX(lat);
 lng = DECtoSEX(lng);

 // Converts degrees to seconds (sex)
 lat = DEGtoSEC(lat);
 lng = DEGtoSEC(lng);

 // Axiliary values (% Bern)
 var lat_aux = (lat - 169028.66) / 10000;
 var lng_aux = (lng - 26782.5) / 10000;

 // Process Y
 var y = 600072.37 +
  211455.93 * lng_aux -
  10938.51 * lng_aux * lat_aux -
  0.36 * lng_aux * Math.pow(lat_aux, 2) -
  44.54 * Math.pow(lng_aux, 3);

 return y;
}

// Convert WGS lat/long (° dec) to CH x
function WGStoCHx(lat, lng) {

 // Converts degrees dec to sex
 lat = DECtoSEX(lat);
 lng = DECtoSEX(lng);

 // Converts degrees to seconds (sex)
 lat = DEGtoSEC(lat);
 lng = DEGtoSEC(lng);

 // Axiliary values (% Bern)
 var lat_aux = (lat - 169028.66) / 10000;
 var lng_aux = (lng - 26782.5) / 10000;

 // Process X
 var x = 200147.07 +
  308807.95 * lat_aux +
  3745.25 * Math.pow(lng_aux, 2) +
  76.63 * Math.pow(lat_aux, 2) -
  194.56 * Math.pow(lng_aux, 2) * lat_aux +
  119.79 * Math.pow(lat_aux, 3);

 return x;

}


// Convert CH y/x to WGS lat
function CHtoWGSlat(y, x) {

 // Converts militar to civil and  to unit = 1000km
 // Axiliary values (% Bern)
 var y_aux = (y - 600000) / 1000000;
 var x_aux = (x - 200000) / 1000000;

 // Process lat
 var lat = 16.9023892 +
  3.238272 * x_aux -
  0.270978 * Math.pow(y_aux, 2) -
  0.002528 * Math.pow(x_aux, 2) -
  0.0447 * Math.pow(y_aux, 2) * x_aux -
  0.0140 * Math.pow(x_aux, 3);

 // Unit 10000" to 1 " and converts seconds to degrees (dec)
 lat = lat * 100 / 36;

 return lat;

}

// Convert CH y/x to WGS long
function CHtoWGSlng(y, x) {

 // Converts militar to civil and  to unit = 1000km
 // Axiliary values (% Bern)
 var y_aux = (y - 600000) / 1000000;
 var x_aux = (x - 200000) / 1000000;

 // Process long
 var lng = 2.6779094 +
  4.728982 * y_aux +
  0.791484 * y_aux * x_aux +
  0.1306 * y_aux * Math.pow(x_aux, 2) -
  0.0436 * Math.pow(y_aux, 3);

 // Unit 10000" to 1 " and converts seconds to degrees (dec)
 lng = lng * 100 / 36;

 return lng;

}


// Convert SEX DMS angle to DEC
function SEXtoDEC(angle) {

 // Extract DMS
 var deg = parseInt(angle, 10);
 var min = parseInt((angle - deg) * 100, 10);
 var sec = (((angle - deg) * 100) - min) * 100;

 // Result in degrees sex (dd.mmss)
 return deg + (sec / 60 + min) / 60;

}

// Convert DEC angle to SEX DMS
function DECtoSEX(angle) {

 // Extract DMS
 var deg = parseInt(angle, 10);
 var min = parseInt((angle - deg) * 60, 10);
 var sec = (((angle - deg) * 60) - min) * 60;

 // Result in degrees sex (dd.mmss)
 return deg + min / 100 + sec / 10000;

}

// Convert Degrees angle to seconds
function DEGtoSEC(angle) {

 // Extract DMS
 var deg = parseInt(angle, 10);
 var min = parseInt((angle - deg) * 100, 10);
 var sec = (((angle - deg) * 100) - min) * 100;

 // Avoid rounding problems with seconds=0
 var parts = String(angle).split('.');
 if (parts.length == 2 && parts[1].length == 2) {
  min = Number(parts[1]);
  sec = 0;
 }

 // Result in degrees sex (dd.mmss)
 return sec + min * 60 + deg * 3600;

}

Debianでka-MapのメモプラスOpenLayers とGeoExt

ブログアーカイブ

自己紹介

2015年4月13日月曜日

2 - ol3.4ex 112b - Tiled WMS with custom projection example 2

0 件のコメント:

Debianでka-Mapのメモ プラスOpenLayers とGeoExt

ブログ アーカイブ

自己紹介

2015年4月13日月曜日

2 - ol3.4ex 112b - Tiled WMS with custom projection example 2

0 件のコメント:

Debianでka-MapのメモプラスOpenLayers とGeoExt

ブログアーカイブ