2 - ol3ex 4b - WMS without client projection example 2

「wms-no-proj.js（204-ol3ex.js）」は、地図を表示するのに必要な javascript です。
（2015.4.20 修正）

「204-ol3ex.js」

var layers = [
  new ol.layer.Tile({
 /** ol.layer.Tile 
  * For layer sources that provide pre-rendered, tiled images 
  * in grids that are organized by zoom levels for specific 
  * resolutions. 
  * プリレンダリング（事前描画）を提供するレイヤソースのための、
  * 特定の解像度でのズームレベルによって編成されているグリッドの
  * タイルイメージ。（ol3 API）
  */
  source: new ol.source.TileWMS({
  /** ol.source.TileWMS
   * Layer source for tile data from WMS servers.
   * WMS サーバからのタイルデータのためのソース。（ol3 API）
   */
 new ol.layer.Image({
  source: new ol.source.ImageWMS({
   attributions: [new ol.Attribution({
   /** ol.Attribution
    * An attribution for a layer source.
    * レイヤソースの属性（ol3 API）
    */

    html: '©' +
    '<a href="http://www.geo.admin.ch/internet/geoportal/' +
    'en/home.html">' +
    'Pixelmap 1:1000000 / geo.admin.ch</a>'
   })],
   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）
    */

   params: {
    'LAYERS': 'ch.swisstopo.pixelkarte-farbe-pk1000.noscale',
    'FORMAT': 'image/jpeg' // 地図以外の部分が黒くなるため
   },

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

 new ol.layer.Image({
 /** ol.layer.Image
  * Server-rendered images that are available for arbitrary 
  * extents and resolutions. 
  * 任意の範囲と解像度で利用可能な server-rendered イメージ。
  * （ol3 API）
  */
  source: new ol.source.ImageWMS({
  /** ol.source.ImageWMS
   * Source for WMS servers providing single, untiled images.
   * 単一、アンタイル（タイル状でない）イメージを提供する WMS 
   * のためのソース。（ol3 API）
   */

   attributions: [new ol.Attribution({
   html: '©' +
   '<a href="http://www.geo.admin.ch/internet/geoportal/' +
   'en/home.html">' +
   'National parks / geo.admin.ch</a>'
   })],
   crossOrigin: 'anonymous',

   params: {'LAYERS': 'ch.bafu.schutzgebiete-paerke_nationaler_bedeutung'},
   serverType: 'mapserver',
   url: 'http://wms.geo.admin.ch/'
  })
 })
];

/** A minimal projection object is configured with only the 
 * SRS code and the map units. No client side coordinate 
 * transforms are possible with such a projection 
 * object.Requesting tiles only needs the code together 
 * with a tile grid of Cartesian coordinates; it does not 
 * matter how those coordinates relate to latitude or 
 * longitude.
 * 最小の投影オブジェクトは、SRS コードおよびマップユニット
 * （units）だけで構成されています。クライアント側座標変換は、投
 * 影オブジェクトで可能です。タイルを要求するには、直交座標のタ
 * イルグリッドと一緒にコードだけ必要とします。それらの座標が緯
 * 度または経度にどのように関連するかは問題ではありません。
 */

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',
 units: 'm'
});

var map = new ol.Map({ 
 layers: layers, 
 renderer: exampleNS.getRendererFromQueryString(),
 //'example-behavior.js' により URL にある renderer を返します
 target: 'map',
 view: new ol.View({
  center: [660000, 190000],
  projection: projection,
  zoom: 9
 })
});