「2162-ol3ex.js」
var vectorSource = new ol.source.Vector({
/** ol.source.Vector
* Provides a source of features for vector layers.
* Vector features provided by this source are suitable
* for editing. See ol.source.VectorTile for vector
* data that is optimized for rendering.
* ベクタレイヤのフィーチャのソースを用意します。このソース
* が提供するベクタフィーチャは、編集に適しています。レンダ
* リングのために最適化されたベクタデータの
* ol.source.VectorTile を参照してください。（ol3 API）
*/
//url: 'data/geojson/countries.geojson', url: 'v3.19.1/examples/data/geojson/countries.geojson', /** url * Setting this option instructs the source to load * features using an XHR loader (see * ol.featureloader.xhr). Use a string and an * ol.loadingstrategy.all for a one-off download of * all features from the given URL. Use a * ol.FeatureUrlFunction to generate the url with * other loading strategies. Requires format to be * set as well. When default XHR feature loader is * provided, the features will be transformed from * the data projection to the view projection during * parsing. If your remote data source does not * advertise its projection properly, this * transformation will be incorrect. For some formats, * the default projection (usually EPSG:4326) can be * overridden by setting the defaultDataProjection * constructor option on the format. Note that if a * source contains non-feature data, such as a * GeoJSON geometry or a KML NetworkLink, these will * be ignored. Use a custom loader to load these. * このオプションを設定すると、XHR ローダーを * （ol.featureloader.xhr参照）を使用してフィーチャを * ロードするためのソースを指示します。指定された URL から * のすべてのフィーチャの1回限りのダウンロードのために * string と ol.loadingstrategy.all を使用してくださ * い。他のローディングストラテジと共に URL を生成するため * に、ol.FeatureUrlFunctionを使用してください。format * も同様に設定する必要があります。デフォルトの XHR フィー * チャローダが提供される場合、フィーチャは、解析中にデータ * 投影からビュー投影へ変換されます。リモート・データ・ソー * スが適切に投影を示していない場合は、この変換は不正確にな * ります。いくつかのフォーマットでは、デフォルトの投影（通 * 常はEPSG：4326）は、フォーマット上の * defaultDataProjection constructor オプションを設 * 定することで上書きすることができます。ソースが、このよう * な GeoJSON ジオメトリ、または、 KML NetworkLink などの * 非フィーチャデータを含んでいる場合、これらは無視される * ことに注意してください。これらをロードするために、カス * タムローダーを使用してください。 * （ol3 API[説明は Stable Only のチェックを外すと表示]） */
format: new ol.format.GeoJSON() /** format * he feature format used by the XHR feature loader when * url is set. Required if url is set, otherwise ignored. * Default is undefined. * フィーチャのフォーマットは、url が設定されている場合、XHR * フィーチャローダーで使用されます。url が設定されている場 * 合は必須で、それ以外の場合は無視されます。デフォルトは未 * 定義です。 * （ol3 API[説明は Stable Only のチェックを外すと表示]） */
});
var map = new ol.Map({
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.OSM()
/** ol.source.OSM
* Layer source for the OpenStreetMap tile server.
* OpenStreetMap タイルサーバのレイヤソース。（ol3 API）
*/
}),
new ol.layer.Vector({
/** ol.layer.Vector
* Vector data that is rendered client-side.
* クライアント側で描画されるベクタデータ。（ol3 API）
*/
source: vectorSource
})
],
target: 'map',
view: new ol.View({
center: [0, 0],
zoom: 2
})
});
var extent = new ol.interaction.Extent({
/** ol.interaction.Extent
* Allows the user to draw a vector box by clicking and
* dragging on the map. Once drawn, the vector box can
* be modified by dragging its vertices or edges. This
* interaction is only supported for mouse devices.
* ユーザがマップ上でクリックとドラッグにより、ベクタボックス
* を描画することができます。描画された後、ベクタボックスは、
* その頂点またはエッジをドラッグすることによって修正すること
* ができます。このインタラクションは、マウスデバイスでのみサ
* ポートされています。
* （ol3 API[説明は Stable Only のチェックを外すと表示]）
*/
condition: ol.events.condition.platformModifierKeyOnly /** ol.events.condition.platformModifierKeyOnly * (mapBrowserEvent) * Return true if only the platform-modifier-key (the * meta-key on Mac, ctrl-key otherwise) is pressed, false * otherwise (e.g. when additionally the shift-key is * pressed). * プラットフォーム-モディファイキー（Macではメタキー、他では * Ctrlキー）が押されている場合は true 、そうでない場合（例 * えば、追加的に shift キーが押されたとき）は false を返し * ます。（ol3 API） */
});
map.addInteraction(extent); /** addInteraction(interaction) * Add the given interaction to the map. * マップへ指定されたインターラクションを追加します。 * （ol3 API） */
extent.setActive(false); /** setActive(active) * Activate or deactivate the interaction. * インタラクションを有効、または、無効にします。 * （ol3 API） */
// Enable interaction by holding shift // shift キーを押し続けることによって、インタラクションを有効 // にします。
this.addEventListener('keydown', function(event) {
/** EventTarget.addEventListener
* The EventTarget.addEventListener() method registers
* the specified listener on the EventTarget it's called
* on. The event target may be an Element in a document,
* the Document itself, a Window, or any other object
* that supports events (such as XMLHttpRequest).
* EventTarget.addEventListener() メソッドは、それが呼び
* 出される EventTarget に指定されたリスナを登録します。イベ
* ントターゲットは、ドキュメントの Element、Document 自身、
* Window、または（XMLHttpRequest などの）イベントをサポート
* している他のオブジェクトです。
* （MDN[https://developer.mozilla.org/en-US/docs/Web/API/
* EventTarget/addEventListener]）
*/
if (event.keyCode == 16) {
/** KeyboardEvent.keyCode [Deprecated]
* The KeyboardEvent.keyCode read-only property represents
* a system and implementation dependent numerical code
* identifying the unmodified value of the pressed key.
* This is usually the decimal ASCII (RFC 20) or Windows
* 1252 code corresponding to the key. If the key can't be
* identified, this value is 0.
* KeyboardEvent.keyCode 読み取り専用プロパティは、押された
* キーの未修正の値を特定するシステムおよび実装に依存する数値
* コードを表します。これは通常、小数点 ASCII（RFC20）または
* キーに対応する Windows1252 のコードです。キーは識別できな
* い場合、この値は0です。
* （MDN[https://developer.mozilla.org/ja/docs/Web/API/
* KeyboardEvent/keyCode]）
*/
extent.setActive(true);
}
});
this.addEventListener('keyup', function(event) {
if (event.keyCode == 16) {
extent.setActive(false);
}
});
0 件のコメント:
コメントを投稿