【Harmoware-VIS】LineMapLayerの使い方

#Harmoware-VIS とは

#LineMapLayerの使い方

Harmoware-VIS で地図要素の描画用のレイヤーとして LineMapLayer を提供しています。

基本書式

<HarmoVisLayers ...
    layers={[
        new LineMapLayer( { data: this.props.linemapData } )
    ]}
/>

データフォーマット

[  // ２点間に直線を描画する要素
   { "sourcePosition": [999.9999, 999.9999, 999], // 始点位置 (経度,緯度,高さ)
     "targetPosition": [999.9999, 999.9999, 999], // 終点位置 (経度,緯度,高さ)
     "color": [999, 999, 999], // 色 (R,G,B)
     "strokeWidth": 999, // 線幅 既定は1（メートル）
   },・・・・・・
   // 多点間を繋ぐ直線を描画する要素
   { "path": [[999.9999, 999.9999, 999],
              [999.9999, 999.9999, 999]・・・・・・], // 点位置 (経度,緯度,高さ)
     "dash ": [5,2], // 点線指定 規定は[0,0]（実線長さ,間隔長さ）で非点線
     "color": [999, 999, 999], // 色 (R,G,B)
     "strokeWidth": 999, // 線幅 既定は1（メートル）
   },・・・・・・
   // ３Ｄオブジェクトを描画する要素
   { "polygon": [[999.9999, 999.9999, 999],
                 [999.9999, 999.9999, 999]・・・・・・], // 点位置 (経度,緯度,高さ)
     "elevation ": 999, // 高さ 規定は`x => x.elevation || 3`（メートル）
     "color": [999, 999, 999], // 色 (R,G,B)
   },・・・・・・
   // 範囲を描画する要素
   { "coordinates":[[999.9999, 999.9999, 999],
                    [999.9999, 999.9999, 999]・・・・・・], // 点位置 (経度,緯度,高さ)
     "color": [999, 999, 999], // 色 (R,G,B)
   },・・・・・・
]

それぞれの要素のキーワードはアクセサで変更できます。

表示例