Blazor シェープ ファイルを地理的データにバインディング

Ignite UI for Blazor Map コンポーネントの IgbShapefileRecord クラスは、形状ファイルから地理空間データ (ポイント/位置、ポリライン、ポリゴン) を読み込み、それを IgbShapefileRecord オブジェクトのコレクションに変換します。

Blazor シェープ ファイルを地理的データにバインディングの例

以下の表は、シェイプ ファイルを読み込むための IgbShapefileRecord クラスのプロパティを説明します。

両方のソース プロパティが null 以外の値に設定されると、IgbShapefileRecord オブジェクトの ImportAsync メソッドが起動し、シェイプ ファイルを取得して読み込み、最終的に変換を実行します。この操作が完了すると、IgbShapefileRecord は IgbShapefileRecord オブジェクトで生成され、シェイプ ファイルから地理空間データを読み込んで変換するプロセスが完了したことを通知するために、ImportCompleted イベントが起動されます。

シェープファイルの読み込み

以下のコードは、世界の主要都市の場所を含むシェイプ ファイルを読み込むための IgbShapefileRecord オブジェクトのインスタンスを作成します。また、xamGeographicMap コントロールにデータをバインドするための前提条件として ImportCompleted イベントを処理する方法も示します。

シェープファイルをバインド

Map コンポーネントでは、Geographic Series は、シェイプ ファイルから読み込まれる地理的データを表示するために使用されます。すべてのタイプの地理的シリーズには、オブジェクトの配列にバインドできる DataSource プロパティがあります。IgbShapefileRecord は IgbShapefileRecord オブジェクトのリストを含むため、このような配列の例です。

IgbShapefileRecord クラスは、以下の表にリストする地理的データを保存するためのプロパティを提供します。

このデータ構造は、適切なデータ列がマップされている限り、ほとんどの地理的シリーズでの使用に適しています。

コード スニペット

このコード例は、シェープ ファイルが IgbShapefileRecord を使用して読み込まれたことを前提としています。 以下のコードは、マップ コンポーネント内の IgbGeographicPolylineSeries を IgbShapefileRecord にバインドし、すべての IgbShapefileRecord オブジェクトの Points プロパティをマップします。

@using IgniteUI.Blazor.Controls


<IgbGeographicMap Height="100%" Width="100%" Zoomable="true">
    <IgbGeographicPolylineSeries ShapefileDataSource="@DataSource"
        ShapeFilterResolution="0.0"
        ShapeStrokeThickness="3"
        ShapeStroke="rgb(82, 82, 82, 0.4)"/>
</IgbGeographicMap>

@code {

    private ShapeDataSource DataSource;

    protected override void OnInitialized()
    {
        this.DataSource = new IgbShapeDataSource()
        {
            ShapefileSource = "https://static.infragistics.com/xplatform/shapes/WorldCableRoutes.shp",
            DatabaseSource = "https://static.infragistics.com/xplatform/shapes/WorldCableRoutes.dbf"
        };
    }
}

API リファレンス