2 - ol3ex 1b - Tiled WMS example 2

「loader.js」は、examples のファイルが地図を表示するのに必要なファイルを読み込むために使用されます。
最初にファイルを Web ブラウザで読み込んだときや、表示された地図の選択リストで「Production」を選んだときは、Google Closure Tools で開発される前のファイル（wms-tiled.js など）が使用されます。表示された地図の選択リストで「Develpment」を選んだときは、Google Closure Tools で開発されたファイル（wms-tiled-require.js や ol-deps.js など）が使用されます。
（Google Closure Tools に関しては、関連サイトを参照してください。）

このまま使用すると、ファイルの位置関係が合わないので、「201-ol3ex.html」と同じディレクトリにコピーして内容を修正します。

「loader.js」

/**
 * This loader is used for the hosted examples.
 * この loader は、提供されている例に使用します。
 * It is used in place of the development loader (examples/loader.js).
 * 開発 loader の場所（examples/loader.js）で使用します。
 *

 * The loader loads ol.js and the example's script in "production" mode; 
 * lodar は、「production」モードでは、ol.js と例のスクリプトを読み込み、
 * it loads Closure Library's base.js, ol-deps.js,
 * the example's "goog.require" script,
 * and the example's script in "development" mode.
 * 「development」モードでは、クロージャライブラリの base.js と ol-deps.js、
 * 例の「goog.require」スクリプト、例のスクリプトを読み込みます。
 * 

 * The ol.js and ol-deps.js scripts are built by OL3's build.py script.
 * ol.js と ol-deps.js スクリプトは、OL3 の build.py スクリプトで構築されています。
 * They are located in the ../build/ directory, relative to this script.
 * この loader.js の相対パスで、../build/ デレクトリに配置されています。

 * The script must be named loader.js.
 * このファイル名は、loader.js でなければなりません。
 * 

 * Usage:
 *     <script src="../loader.js?id=my-demo"></script>
 */
---

「Production」時のアドレス




http://127.0.0.1:8020/ol3proj/201-ol3ex.html
http://127.0.0.1:8020/ol3proj/201-ol3ex.html?mode=advanced

「Development」時のアドレス



http://127.0.0.1:8020/ol3proj/201-ol3ex.html?mode=raw
（advanced と raw 名前をつけ間違えたのかな？）

---
(function() {

 var i, pair;
// モード（mode: "raw","advancd" [選択リストでは、"Development","Production"]切替）
 var href = window.location.href, start, end, paramsString, pairs,pageParams = {};

 if (href.indexOf('?') > 0) {
  start = href.indexOf('?') + 1;
  end = href.indexOf('#') > 0 ? href.indexOf('#') : href.length;
  paramsString = href.substring(start, end);
  pairs = paramsString.split(/[&;]/);
  for (i = 0; i < pairs.length; ++i) {
   pair = pairs[i].split('=');
   if (pair[0]) {
    pageParams[decodeURIComponent(pair[0])] = 
     decodeURIComponent(pair[1]);
   }
  }
 }

// カスタムスクリプトの読込（"loader.js?id=" の後の文字列取得）
 var scripts = document.getElementsByTagName('script');
 var src, index, search, chunks, scriptParams = {};
 for (i = scripts.length - 1; i >= 0; --i) {
  src = scripts[i].getAttribute('src');
  if (~(index = src.indexOf('loader.js?'))) {
   search = src.substr(index + 10);
   chunks = search ? search.split('&') : [];
   for (i = chunks.length - 1; i >= 0; --i) {
    pair = chunks[i].split('=');
    if (pair[0]) {
     scriptParams[decodeURIComponent(pair[0])] =
      decodeURIComponent(pair[1]);
    }
   }
   break;
  }
 }

// OpenLyaers3 の読込（mode が 'advanced' か 'raw' なので、'ol.js' を読込）
 var raw = pageParams.mode && pageParams.mode.toLowerCase() === 'raw';
 var scriptId = encodeURIComponent(scriptParams.id);
 if (mode != 'raw') {
 // document.write('<scr' + 'ipt type="text/javascript" src="../build/ol.js"></scr' + 'ipt>');
 // ディレクトリ修正
  document.write('<scr' + 'ipt type="text/javascript" src="v3.0.0/build/ol.js"></scr' + 'ipt>');

 } else {

  window.CLOSURE_NO_DEPS = true;
 // we've got our own deps file（'ol-deps.js' のこと）
 // document.write('<scr' + 'ipt type="text/javascript" src="../closure-library/closure/goog/base.js"></scr' + 'ipt>');
 // document.write('<scr' + 'ipt type="text/javascript" src="../build/ol-deps.js"></scr' + 'ipt>');
 // ディレクトリ修正
  document.write('<scr' + 'ipt type="text/javascript" src="v3.0.0/closure-library/closure/goog/base.js"></scr' + 'ipt>');
  document.write('<scr' + 'ipt type="text/javascript" src="v3.0.0/build/ol-deps.js"></scr' + 'ipt>');
  document.write('<scr' + 'ipt type="text/javascript" src="' + scriptId + '-require.js"></scr' + 'ipt>');
 }
 document.write('<scr' + 'ipt type="text/javascript" src="' + scriptId + '.js"></scr' + 'ipt>');
}());

「201-ol3ex.html」の「loader.js」のディレクトリを修正します。

<!--
  <script src="loader.js?id=wms-tiled" type="text/javascript"></script>
  <script src="v3.0.0/examples/loader.js?id=201-ol3ex" type="text/javascript"></script>
-->
  <!-- ファイル修正 -->  <!-- ディレクトリ修正 -->
  <script src="loader.js?id=201-ol3ex" type="text/javascript"></script>

 </body>
</html>