7.3 Spatial Studio Webコンポーネントとのやりとりの方法

埋め込むSpatial Studio Webコンポーネントとやりとりするための、サポートされているメソッドを示します。

• clearFilters
  
• filterFeatures
  
• selectFeatures
  
• features_selected
  

7.3.1 clearFilters

メソッド名: clearFilters(layerId: string)

説明: 指定されたlayerIdについてすべてのフィルタをクリアします。

例:

const spatialStudioProjectElement = document.getElementById('spatial-studio-project-1');

const layerId = 'abcd1234';

spatialStudioProjectElement.clearFilters(layerId);

7.3.2 filterFeatures

メソッド名: filterFeatures(layerId: string, columnName: string, values: any[])

説明: 指定されたlayerId、columnName、およびvaluesの配列についてフィーチャをフィルタします。

例:

const studioProjectElement = document.getElementById('spatial-studio-project-1');

const layerId = 'abcd1234';
const columnName = 'COUNTRY_NAME';
const values = ['Canada, 'Ireland', 'Japan'];

studioProjectElement.filterFeatures(layerId, columnName, values);

7.3.3 selectFeatures

メソッド名: selectFeatures(datasetId: string, featureKeys: any[])

説明: datasetId、およびfeatureKeysの配列によってフィーチャを選択し強調表示します。

例:

const studioProjectElement = document.getElementById('spatial-studio-project-1');

const datasetId = "7e4c89462b580ae2f253adf5c8bff711";
const selectedFeatureIds = [1, 3, 10];

studioProjectElement.selectFeatures(datasetId, selectedFeatureIds);

7.3.4 features_selected

イベント名: features_selected

説明: イベントは、フィーチャ選択が変更されたときにトリガーされます。最も一般的なのは、ユーザーがマップ内や表内のフィーチャを選択したときです。データセットのフィーチャ・キーの配列を含むDatasetSelectedFeaturesオブジェクトは、次のように定義されます:

DatasetSelectedFeatures: {
    datasetId         : string,
    featureKeys       : Array<string | number>
}

例: 次のコード例では、Web要素への参照を取得し、Webコンポーネントにリスナーを追加し、コールバックを定義しています。

const studioProjectElement = document.getElementById('spatial-studio-project-1');
studioProjectElement.addEventListener('features_selected', (event) => {
    const selectionObjects = event.detail.value;
    console.log(JSON.stringify(selectionObjects));
});