説明に次のようにあります。
Demonstrates smooth reloading of layers when changing a dimension continously. The demonstration layer is a global sea-level computation (flooding computation from SCALGO, underlying data from CGIAR-CSI SRTM) where cells that are flooded if the sea-level rises to more than x m are colored blue. The user selects the sea-level dimension using a slider.
継続的に寸法を変更する際にレイヤの円滑な再読み込みを示します。デモレイヤは、海面がxメータ以上に上昇すると氾濫するセルが青色に着色されるグローバル海面計算（CGIAR-CSI SRTM からのデータを基礎とする、SCALGOからの氾濫計算）です。ユーザは、スライダを使用して、海面の位置を選択します。
SRTM は、SRTM 90m Digital Elevation Database v4.1（http://www.cgiar-csi.org/data/srtm-90m-digital-elevation-database-v4-1）に次のようにあります。
The NASA Shuttle Radar Topographic Mission (SRTM) has provided digital elevation data (DEMs) for over 80% of the globe. This data is currently distributed free of charge by USGS and is available for download from the National Map Seamless Data Distribution System, or the USGS ftp site.
NASAのシャトルレーダ地形ミッション（SRTM）は、世界の80％以上のデジタル標高データ（DEM）を提供しています。このデータは、現在、USGSによって無償で配布され、ナショナルマップシームレスデータ提供システム、または USGS FTP サイトからダウンロードすることができます。
SCALGO（http://scalgo.com/） は、（http://scalgo.com/solutions/）に次のようにあります。
The power of SCALGOs unique technology for processing big large-area high-resolution terrain data sets is available through three different product lines. SCALGO Desktop is a set of software packages that allow for efficient processing of big terrain data sets on a standard workstation. Through the SCALGO Analysis product line you get access to advanced state-of-the-art hydrology and modeling products. Finally SCALGO Live is a comprehensive online solution based on the simple philosophy that it is not the terrain data itself—but what you can learn from it—that matters. SCALGO Live is the ultimate tool to extract, maintain, visualize and distribute knowledge based on your terrain data.
大きな大面積高解像度の地形データセットを処理するための SCALGO のークな技術の力は、3つの異なる製品ラインで入手することができます。 SCALGO Desktop は、標準的なワークステーション上で大きな地形データセットの効率的な処理を可能にするソフトウェア・パッケージのセットです。 SCALGO Analysis 製品ラインを通して、高度な最先端の水文学とモデリング製品へのアクセスを取得します。最後に、 SCALGO Live は、それは自体地形データではありません、しかし、それから学ぶことができる、もの、というシンプルな理念に基づいた総合的なオンラインソリューションです。 SCALGO Live は、地形データに基づいた知識を抽出、維持、視覚化、そして配布するための究極のツールです。
HTML ファイルの作成
同じように「wmts-dimensions.js」を開きます。
f 「wmts-dimensions.html」の内容をコピーして「2142-ol3ex.html」に貼り付け、修正します。
g 同じように、新規に「2142-ol3ex.js」ファイルを作成し、「File Template」ウィンドウで「JavaScript Template」をクリックして選択し、「完了」ボタンをクリックして、「wmts-dimensions.js」の内容をコピーして貼り付け、修正します。「wmts-dimensions-require.js」も「2142-ol3ex-require.js」に貼り付けます。
「2142-ol3ex.html」
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="chrome=1"> <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" type="text/css"> <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-combined.min.css" type="text/css">
<!-- <link rel="stylesheet" href="../css/ol.css" type="text/css"> <link rel="stylesheet" href="./resources/layout.css" type="text/css"> <link rel="stylesheet" href="./resources/prism/prism.css" type="text/css"> <script src="./resources/zeroclipboard/ZeroClipboard.min.js"></script> 「resources」の位置が変わりました。 --> <!-- ディレクトリ修正 --> <link rel="stylesheet" href="v3.12.1/css/ol.css" type="text/css"> <link rel="stylesheet" href="v3.12.1/examples/resources/layout.css" type="text/css"> <link rel="stylesheet" href="v3.12.1/examples/resources/prism/prism.css" type="text/css"> <script src="v3.12.1/examples/resources/zeroclipboard/ZeroClipboard.min.js"></script>
<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=fetch"></script>
<title>WMTS Tile Transitions</title> </head> <body>
<!-- bootstrap-combined.min.css, ol.css, layout.css, CSSファイルで設定されたセレクタを使用。 --> <header class="navbar" role="navigation"> <div class="container" id="navbar-inner-container">
<!--
<a class="navbar-brand" href="./"><img src="./resources/logo-70x70.png"> OpenLayers 3 Examples</a>
-->
<!-- ディレクトリ修正 -->
<a class="navbar-brand" href="v3.12.1/examples/"><img src="v3.12.1/examples/resources/logo-70x70.png"> OpenLayers 3 Examples</a>
</div>
</header>
<div class="container-fluid">
<div class="row-fluid">
<div class="span12">
<h4 id="title">WMTS Tile Transitions</h4>
<div id="map" class="map"></div>
<label>
Sea-level
<input id="slider" type="range" value="10" max="100" min="-1">
</label>
<span id="theinfo"></span>
</div>
</div>
<div class="row-fluid"> <div class="span12">
<p id="shortdesc">Example of smooth tile transitions when changing the dimension of a WMTS layer. </p>
<div id="docs"><p>Demonstrates smooth reloading
of layers when changing a dimension continously. The
demonstration layer is a global sea-level computation
(flooding computation from
<a href="http://scalgo.com">SCALGO</a>,
underlying data from
<a href="http://www.cgiar-csi.org/data/
srtm-90m-digital-elevation-database-v4-1">
CGIAR-CSI SRTM</a>) where cells that are flooded
if the sea-level rises to more than <em>x</em>
m are colored blue. The user selects the sea-level
dimension using a slider.</p>
</div>
<div id="api-links">Related API documentation:
<ul class="inline">
<li>
<!-- <a href="../apidoc/ol.Attribution.html" title="API documentation for ol.Attribution">ol.Attribution</a> -->
<a href="v3.12.1/apidoc/ol.Attribution.html" title="API documentation for ol.Attribution">ol.Attribution</a>
</li>,
<li>
<!-- <a href="../apidoc/ol.Map.html" title="API documentation for ol.Map">ol.Map</a> -->
<a href="v3.12.1/apidoc/ol.Map.html" title="API documentation for ol.Map">ol.Map</a>
</li>,
<li>
<!-- <a href="../apidoc/ol.View.html" title="API documentation for ol.View">ol.View</a> -->
<a href="v3.12.1/apidoc/ol.View.html" title="API documentation for ol.View">ol.View</a>
</li>,
<li>
<!-- <a href="../apidoc/ol.extent.html" title="API documentation for ol.extent">ol.extent</a> -->
<a href="v3.12.1/apidoc/ol.extent.html" title="API documentation for ol.extent">ol.extent</a>
</li>,
<li>
<!-- <a href="../apidoc/ol.layer.Tile.html" title="API documentation for ol.layer.Tile">ol.layer.Tile</a> -->
<a href="v3.12.1/apidoc/ol.layer.Tile.html" title="API documentation for ol.layer.Tile">ol.layer.Tile</a>
</li>,
<li>
<!-- <a href="../apidoc/ol.proj.html" title="API documentation for ol.proj">ol.proj</a> -->
<a href="v3.12.1/apidoc/ol.proj.html" title="API documentation for ol.proj">ol.proj</a>
</li>,
<li>
<!-- <a href="../apidoc/ol.source.OSM.html" title="API documentation for ol.source.OSM">ol.source.OSM</a> -->
<a href="v3.12.1/apidoc/ol.source.OSM.html" title="API documentation for ol.source.OSM">ol.source.OSM</a>
</li>,
<li>
<!-- <a href="../apidoc/ol.source.WMTS.html" title="API documentation for ol.source.WMTS">ol.source.WMTS</a> -->
<a href="v3.12.1/apidoc/ol.source.WMTS.html" title="API documentation for ol.source.WMTS">ol.source.WMTS</a>
</li>,
<li>
<!-- <a href="../apidoc/ol.tilegrid.WMTS.html" title="API documentation for ol.tilegrid.WMTS">ol.tilegrid.WMTS</a> -->
<a href="v3.12.1/apidoc/ol.tilegrid.WMTS.html" title="API documentation for ol.tilegrid.WMTS">ol.tilegrid.WMTS</a>
</li>
</ui>
</div>
</div>
</div>
<div class="row-fluid">
<div id="source-controls">
<a id="copy-button">
<i class="fa fa-clipboard"></i> Copy
</a>
<a id="jsfiddle-button">
<i class="fa fa-jsfiddle"></i> Edit
</a>
</div>
<form method="POST" id="jsfiddle-form" target="_blank" action="http://jsfiddle.net/api/post/jquery/1.11.0/">
<textarea class="hidden" name="js">
// --- 省略 --- </html></code></pre>
</div> </div>
<!-- <script src="./resources/common.js"></script> <script src="./resources/prism/prism.min.js"></script> --> <!-- ディレクトリ修正 CommonJS と prism.js --> <script src="v3.12.1/examples/resources/common.js"></script> <script src="v3.12.1/examples/resources/prism/prism.min.js"></script>
<!-- <script src="loader.js?id=wmts-dimensions"></script> --> <!-- ファイル修正 --> <!-- ディレクトリ修正 --> <script src="loader.js?id=2142-ol3ex"></script>
</body> </html>
COMMONJS は
COMMONJS
http://webpack.github.io/docs/commonjs.html
に、次のようにあります。
The CommonJS group defined a module format to solve JavaScript scope issues by making sure each module is executed in its own namespace.
This is achieved by forcing modules to explicitly export those variables it wants to expose to the “universe”, and also by defining those other modules required to properly work.
To achieve this CommonJS give you two tools:
the require() function, which allows to import a given module into the current scope.
the module object, which allows to export something from the current scope.
CommonJSグループは、それ自身の名前空間内で実行されている各モジュールを確認することによって、JavaScriptのスコープ問題を解決するためのモジュールフォーマットを定義しました。
これは、それが「universe（？）」に公開したい変数を明示的にエクスポートするモジュールを強制することによって、同じように、正常に動作するのに必要な他のモジュールを定義することによって、達成されます。
この CommonJS を達成するために2つのツールを与えます：
require()関数、指定したモジュールを現在のスコープにインポートすることができます。
モジュールオブジェクト、現在のスコープからエクスポートすることができます。
Prism は、
Prism
http://prismjs.com/
に、次のようにあります。
Prism is a lightweight, extensible syntax highlighter, built with modern web standards in mind. It’s a spin-off from Dabblet and is tested there daily by thousands.
Prismは、最新のWeb標準に構築されたことを考慮し軽量で拡張可能なシンタックスハイライトです。それは Dabblet からスピンオフで、何千人も日々そこで試験されています。
ZeroClipboard は
ZeroClipboard v2.x
http://zeroclipboard.org/
に、次のようにあります。
The ZeroClipboard library provides an easy way to copy text to the clipboard using an invisible Adobe Flash movie and a JavaScript interface.
ZeroClipboard ライブラリは、見えない Adobe Flash ムービーとJavaScript のインターフェイスを使用してテキストをクリップボードにコピーする簡単な方法を提供します。
Debian 8 では動作しませんでした。ボタンを右クリックしたときに flash のコンテキストメニューが表示されると動作しています。
0 件のコメント:
コメントを投稿