2014年10月2日木曜日

2 - ol3ex 14b - ZoomSlider control 2

「zoomslider.js(214-ol3ex.js)」は、地図を表示するのに必要な javascript です。
「214-ol3ex.js」
/**
 * Helper method for map-creation.
 *
 * @param {string} divId The id of the div for the map.
 * divId は map の div 要素の id
 * @return {ol.Map} The ol.Map instance.
 */
 /** 「@param」
  * The @param tag provides the name, type, and 
  * description of a function parameter.
  * The @param tag requires you to specify the name of 
  * the parameter you are documenting. You can also 
  * include the parameter's type, enclosed in curly 
  * brackets, and a description of the parameter.
  * @paramタグは、関数パラメータの名前と型、説明を提供します。
  * @paramタグを使用すると、文書化されたパラメータの名前を
  * 指定する必要があります。また、パラメータのタイプと、中括弧
  * で囲まれたおよびパラメータの説明を含めることができます。
  * (@use JSDoc [http://usejsdoc.org/tags-param.html])
  */
 /** @return(@returns と同義)
  * The @returns tag documents the value that a function 
  * returns.
  * @returns タグは、関数が返す値について説明します。
  * (@use JSDoc [http://usejsdoc.org/tags-returns..html])
  */
var createMap = function(divId) {
 var source, layer, map, zoomslider, resolutions;

 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 参照)
  */
 layer = 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: source
 });
 map = new ol.Map({
  layers: [layer],
  target: divId,
  view: new ol.View({
// center: [0, 0],
   center: [15520720, 4257706], // 東京の座標
// zoom: 2
   zoom: 9
  })
 });
 zoomslider = new ol.control.ZoomSlider();
 /** ol.control.ZoomSlider 
  * A slider type of control for zooming.
  * ズームのためのスライダタイプのコントロール。
  * (ol3 API)
  */
 map.addControl(zoomslider);
 /** addControl(control)
  * Add the given control to the map.
  * 指定したコントロールをマップに追加します。
  * (ol3 API)
  */
 return map;
};
var map1 = createMap('map1');
var map2 = createMap('map2');
var map3 = createMap('map3');

0 件のコメント: