「selection.js（9-ol3cesium18.js）」は、マップを表示するための JavaScript ファイルです。
OL3-Cesium API は、現在、すべて実験的（experimental）なものです。
「9-ol3cesium18.js」
var raster = 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.MapQuest({layer: 'sat'})
/** ol.source.MapQuest
* Layer source for the MapQuest tile server.
* MapQuest タイルサーバのレイヤソース。（ol3 API
* 2 - ol3ex 23b - MapQuest example 2 参照）
*/
});
var vector = new ol.layer.Vector({
/** ol.layer.Vector
* Vector data that is rendered client-side.
* クライアント側で描画されたベクタデータ。（ol3 API）
*/
source: new ol.source.Vector({
/** ol.source.Vector
* Provides a source of features for vector layers.
* ベクタレイヤのフィーチャのソースを提供します。（ol3 API）
*/
format: new ol.format.GeoJSON(), /** ol.format.GeoJSON * Feature format for reading and writing data * in the GeoJSON format. * GeoJSON フォーマットのデータを読み書きするための * フィーチャフォーマット。（ol3 API） */
// url: 'data/geojson/countries.geojson' url: './js/libs/ol3-cesium-v1.8/examples/data/geojson/countries.geojson'
}) });
var map = new ol.Map({
layers: [raster, vector],
target: 'map2d',
view: new ol.View({
center: [0, 0],
zoom: 2
})
});
var ol3d = new olcs.OLCesium({map: map, target: 'map3d'});
/** new olcs.OLCesium(options)
* map: The OpenLayers map we want to show on a Cesium scene.
* Cesium シーンで表示したい OpenLayers マップ。
* （OL3-Cesium API）
*/
var scene = ol3d.getCesiumScene(); /** getCesiumScene() * （OL3-Cesium API に説明がありませんでした。） */
ol3d.setEnabled(true); /** setEnabled(enable) * Enables/disables the Cesium. This modifies the visibility * style of the container element. * セシウムを有効または無効にします。これは、コンテナ要素の可視 * 性スタイルを変更します。 * （OL3-Cesium API） */
var selectionStyle = new ol.style.Style({
/** ol.style.Style
* Base class for vector feature rendering styles.
* ベクタフィーチャがスタイルを描画するための基本クラス。
* （ol3 API[説明は Stable Only のチェックを外すと表示]）
*/
fill: new ol.style.Fill({
/** ol.style.Fill
* Set fill style for vector features.
* ベクタフィーチャの塗りつぶしスタイルを設定。（ol3 API）
*/
color: [255, 255, 255, 0.6] }),
stroke: new ol.style.Stroke({
/** ol.style.Stroke
* Set stroke style for vector features.
* Note that the defaults given are the Canvas defaults,
* which will be used if option is not defined.
* The get functions return whatever was entered in the
* options; they will not return the default.
* ベクタフィーチャのためのストロークスタイルの設定。
* デフォルトは、オプションが定義されていない場合に使用され
* る Canvas のデフォルトを与えられることに注意してください。
* GET 関数は、オプションで入力されたものはすべて返します。
* それらはデフォルトを返しません。
* （ol3 API[説明は Stable Only のチェックを外すと表示]）
*/
color: [0, 153, 255, 1], width: 3
}) });
var selectedFeature;
map.on('click', function(e) {
/** on(type, listener, opt_this)
* Listen for a certain type of event.
* あるタイプのイベントをリッスンします。（ol3 API）
*/
if (selectedFeature) {
selectedFeature.setStyle(null); /** setStyle(style) * Set the style for the feature. This can be a single * style object, an array of styles, or a function that * takes a resolution and returns an array of styles. If * it is null the feature has no style (a null style). * フィーチャのスタイルを設定します。これは、単一のスタイルオブ * ジェクト、スタイルの配列、または解像度をとり、スタイルの配列 * を返す関数とすることができます。null の場合、フィーチャは、 * スタイルなし（null のスタイル）を持ちます。（ol3 API） */
}
selectedFeature = map.forEachFeatureAtPixel( /** forEachFeatureAtPixel(pixel, callback, opt_this, * opt_layerFilter, opt_this2) * Detect features that intersect a pixel on the viewport, * and execute a callback with each intersecting feature. * Layers included in the detection can be configured * through opt_layerFilter. * ビューポート上のピクセルと交差するフィーチャを検出し、互 * いに交差するフィーチャと共にコールバックを実行します。 * 検出に含まれるレイヤが opt_layerFilter を通じて設定する * ことができます。（ol3 API） */
e.pixel,
function(feature, layer) {
return feature;
});
if (selectedFeature) {
selectedFeature.setStyle(selectionStyle);
}
});
Chromium では表示できないので、Iceweasel（Firefox）のアドレスバーにhttp://localhost/~user/ol3cesiumproj/public_html/9-ol3cesium18.html
と入力して表示します。
0 件のコメント:
コメントを投稿