2 - ol3.4ex 111b - Semi-transparent layer example 2

「semi-transparent-layer.js（2111-ol3ex.js）」は、マップを表示するための JavaScript ファイルです。

Mapbox
http://a.tiles.mapbox.com/v3/mapbox/maps.html#!/map/map_1314132938521

に次のようにあります。

MapBox maps include a wide range of baselayers, data overlays, world borders and labels that are available to the public.

MapBox マップは、公衆に有用な広い範囲のベースマップやデータオーバーレイ、国境、ラベルを含んでいます。

この下の画像一覧に「va-quake-aug.jsonp」があります。

「2111-ol3ex.js」

var map = new ol.Map({
 layers: [
  new ol.layer.Tile({

   source: new ol.source.MapQuest({layer: 'sat'})
   /** ol.source.MapQuest
    * Layer source for the MapQuest tile server.
    * MapQuest タイルサーバのレイヤソース。（ol3 API
    * 2 - ol3ex 23b - MapQuest example 2 参照）
    */

  }),
  new ol.layer.Tile({

   source: new ol.source.TileJSON({
   /** ol.source.TileJSON 
    * Layer source for tile data in TileJSON format.
    * TileJSON フォーマットのタイルデータのためのレイヤソース。
    *（ol3 API）
     */

    url: 'http://api.tiles.mapbox.com/v3/mapbox.va-quake-aug.jsonp',

    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）
     */

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

  center: ol.proj.transform([-77.93255, 37.9555], 'EPSG:4326', 'EPSG:3857'),

  zoom: 5
 })
});