DataV:飛行ルートレイヤー (v4.x)

チャートスタイル

フライングラインレイヤは、基本フラットマップ4.0のサブコンポーネントである。 独立したスタイルとデータ構成をサポートしています。 地理的位置の2点間のODデータを飛行線の形で表すことができます。 物流や取引など、2つの場所間の関連情報を表示するために使用できます。

スタイルパネル

• 検索設定: スタイルパネルの右上隅にある検索設定項目アイコンをクリックします。 [検索設定] パネルで、検索する設定項目の名前を入力し、設定項目を検索します。 あいまい一致はサポートされていません。 詳細については、「設定項目の検索」をご参照ください。

• クイックスタイル: Flying Route Layerサブウィジェットは、クイックスタイル機能を提供します。 ビジネス要件に基づいてスタイルを選択できます。

• General: 飛行ルートレイヤの一般的な設定項目を指定します。

  メトリクス	説明
  表示レベル	フライングラインレイヤーの表示レベルの値を設定します。 フライングラインレイヤーは、指定されたレベル範囲内で表示され、レベル外では表示されません。
  不透明度	飛行ルートレイヤーの不透明度。 有効値: 0~100。 単位: % 。 値が大きいほど、レイヤーはより不透明になります。

• グラフィック: フライングラインスタイル、ラインヘッドスタイル、開始点バブルスタイル、ドロップポイントバブルスタイルなど、フライングラインレイヤーのグラフィック設定項目を設定します。

  メトリクス	説明
  飞行ルートスタイル	飛行ラインのスタイルを設定します。 線の種類: ドロップダウンリストから線の種類を選択します。 線幅: 飛行線の線幅を設定する方法の詳細については、「Dimension mapper」をご参照ください。 飛行ルートの色: 飛行ルートの色パターンを設定します。 詳細については、「カラーマッパーの使用」をご参照ください。 Length: 現在のフライトインターバルとフライト時間での飛行ラインの長さの割合を示します。 値の範囲は0から100です。 単位: % 。 ラジアン: スライダをドラッグして、フライトラインのラジアンを設定します。 有効な値は 0～1 です。 飛行時間: 飛行線の始点から終点までの時間を示します。 有効な値: 100〜5000。 単位：ms。 出発間隔: 前の飛行ラインの尾部の出発と開始点からの次の飛行ラインの出発の間の時間を示します。 始点から終点までの距離に対する飛行線の長さは、飛行時間と出発間隔によって決まります。 出発間隔 /出発間隔の値が大きいほど、飛行ラインは短くなる。 値の範囲は10から3000です。 アニメーションタイプ: 飛行線のアニメーションタイプを選択します。 有効な値: 同期およびランダム。 グロー効果: フラッド半径と光度を含むフライングラインの照明効果。 セリフスタイル: セリフの線タイプ、幅、色など、飛行線の下のセリフのスタイルを指定します。
  ヘッドスタイル	フライングラインヘッドのスタイルを設定します。 ヘッドスタイルの左側にあるアイコンをクリックして、ヘッドスタイルの表示を制御します。 ラインヘッドタイプ: ラインヘッドのタイプ。 有効な値: VectorおよびIcon。 ベクトル形状: ベクトル形状を選択します。 デフォルトでは、フレアが選択されています。 このパラメーターは、[ヘッドタイプ] で [ベクトル] を選択した場合にのみ使用できます。 色: 現在のベクトル形状の色。 このパラメーターは、[ヘッドタイプ] で [ベクトル] を選択した場合にのみ使用できます。 半径: 現在のベクトル形状の半径を指定します。 線の色: 現在のベクトル形状の線の色を設定します。 このパラメーターは、[ヘッドタイプ] で [ベクトル] を選択した場合にのみ使用できます。 ストロークの重み: 現在のベクトル形状のストロークの重みを設定します。 値の範囲は0から5です。 単位: ピクセル。 このパラメーターは、[ヘッドタイプ] で [ベクトル] を選択した場合にのみ使用できます。 アイコンシェイプ: アイコンスタイルを選択します。 [スタイル] の横にあるドロップダウンボックスをクリックして、さまざまな組み込みアイコンスタイルを選択できます。 ドロップダウンパネルの入力ボックスに画像のURLを入力して、リモートサーバー上の画像をアイコンとして使用することもできます。 入力ボックスの右側にあるアイコンをクリックして、ローカル画像をアイコンとしてアップロードすることもできます。 このパラメーターは、ヘッドタイプでアイコンを選択した場合にのみ使用できます。
  スタートバブル	飛行線の始点バブルのスタイルを設定します。 左側のアイコンをクリックして、開始バブルの表示を制御します。 バブル半径: 開始バブルのバブル半径を設定します。 詳細については、「サイズマッパーの使用」をご参照ください。 アイコン回避: アイコンは、アイコン回避機能を有効にして、アイコンが互いに重ならないようにするかどうかを制御します。 バブルスタイル: バブルスタイルの横にあるまたはアイコンをクリックして、バブルスタイルを追加または削除します。 またはアイコンをクリックして、複数のバブルスタイルでページレイアウトを設定します。 アイコンをクリックして現在選択されているスタイル設定をコピーし、同じ設定のバブルスタイルを追加します。 形状: 開始点バブルのアイコンスタイル。 [スタイル] の横にあるドロップダウンリストをクリックして、さまざまな組み込みアイコンスタイルを選択できます。 ドロップダウンパネルの入力ボックスで入力画像のURLを指定して、リモートサーバー上の画像をバブルアイコンとして使用することもできます。 入力ボックスの右側にあるアイコンをクリックして、ローカル画像をバブルアイコンとしてアップロードすることもできます。 色: バブルの色。 詳細については、「カラーマッパー」をご参照ください。 サイズスケール: バブル半径に基づいて生成された設定アイテムアイコンに対するバブルのスケールを設定します。 スケールの範囲は0から1です。 アニメーション: バブルの呼吸をアニメーション化します。 タイプ: バブルのアニメーションのタイプ (回転、呼吸、フェード、グロー、拡散など) 。 速度: 同期やカスタムなど、バブルアニメーションのタイプを指定します。 同期は、バブル呼吸アニメーションが飛行ラインアニメーションと同期されることを示します。 [カスタム] を選択した場合、カスタム速度を設定できます。 速度は500から5000まで及びます。 単位：ms。 遅延: バブルのアニメーション遅延を指定します。 有効な値: 0 ~ 1000 単位：ms。 ズーム範囲: バブルのズーム範囲を指定します。 範囲は1から5です。 このパラメーターは、アニメーションタイプで呼吸を選択したときに設定できます。 透明範囲: スライダーをドラッグして、バブルの透明範囲を設定します。 透明度の範囲は0〜100です。 この機能は、アニメーションタイプフィールドをFoldに設定した場合にのみ使用できます。 グローカラー: バブルの色を設定します。 Animation TypeパラメーターをGlowに設定すると、このパラメーターを設定できます。 光度: バブルの光度。 有効な値: 1 ~ 5。 アニメーションタイプにグローを選択したときに設定できます。 発光半径: バブルの発光半径を指定します。 値の範囲は0から20です。 Animation TypeでGlowを選択した場合に設定できます。 サイズ修正: 画像の輝くエッジが異常に整列している場合は、このパラメーターを調整してサイズを調整します。 範囲は-1から1です。 Animation TypeでGlowを選択した場合に設定できます。 拡散乗数: バブル半径の設定項目に基づいて生成されるアイコンを基準としたバブルの拡散乗数を設定します。 有効な値: 1 ~ 5。 このパラメーターは、Animation TypeパラメーターをDiffuseに設定した場合に使用できます。
  バブル	飛行ルートのドロップポイントバブルのスタイルを設定します。 左側のアイコンをクリックして、ドロップバブルの表示を制御します。 バブル半径: バブルのバブル半径を指定します。 詳細については、「サイズマッパーの使用」をご参照ください。 アイコン回避: アイコンは、アイコン回避機能を有効にして、アイコンが互いに重ならないようにするかどうかを制御します。 バブルスタイル: バブルスタイルの横にあるまたはアイコンをクリックして、バブルスタイルを追加または削除します。 またはアイコンをクリックして、複数のバブルスタイルでページレイアウトを設定します。 アイコンをクリックして現在選択されているスタイル設定をコピーし、同じ設定のバブルスタイルを追加します。 形状: バブルのアイコンスタイル。 [スタイル] の横にあるドロップダウンリストをクリックして、さまざまな組み込みアイコンスタイルを選択できます。 ドロップダウンパネルの入力ボックスに画像のURLを入力して、リモートサーバー上の画像をバブルアイコンとして使用することもできます。 入力ボックスの右側にあるアイコンをクリックして、ローカル画像をバブルアイコンとしてアップロードすることもできます。 色: バブルの色。 詳細については、「カラーマッパー」をご参照ください。 サイズスケール: バブル半径に基づいて生成された設定アイテムアイコンに対するバブルのスケールを設定します。 有効な値は 0～1 です。 アニメーション: バブルの呼吸をアニメーション化します。 タイプ: バブルのアニメーションのタイプ (回転、呼吸、フェード、グロー、拡散など) 。 速度: バブルアニメーションのタイプ。 有効な値: 同期およびカスタム。 同期は、バブル呼吸アニメーションが飛行ラインアニメーションと同期されることを示します。 [カスタム] を選択した場合、カスタム速度を設定できます。 有効な値: 500〜5000。 単位：ms。 遅延: バブルのアニメーション遅延を指定します。 有効な値: 0 ~ 1000 単位：ms。 ズーム範囲: バブルのズーム範囲を指定します。 有効な値: 1 ~ 5。 このパラメーターは、アニメーションタイプで呼吸を選択したときに設定できます。 透明範囲: スライダーをドラッグして、バブルの透明範囲を設定します。 透明度の範囲は0〜100です。 このパラメーターは、Animation TypeパラメーターをFadeに設定した場合にのみ使用できます。 グローカラー: バブルの色。 Animation TypeパラメーターをGlowに設定すると、このパラメーターを設定できます。 光度: バブルの光度を指定します。 有効な値: 1 ~ 5。 アニメーションタイプにグローを選択したときに設定できます。 発光半径: バブルの発光半径を指定します。 有効な値: 0〜20。 アニメーションタイプにグローを選択したときに設定できます。 サイズ修正: 画像の輝くエッジが異常に整列している場合は、このパラメーターを調整してサイズを調整します。 範囲は-1から1です。 アニメーションタイプにグローを選択したときに設定できます。 拡散乗数: バブル半径の設定項目に基づいて生成されたアイコンに対するバブルの拡散係数を設定します。 値の範囲は1から5です。 このパラメーターは、Animation TypeパラメーターをDiffuseに設定した場合に使用できます。

• インタラクション: 飛行ルートレイヤのインタラクション設定項目。

  • グラフィックインタラクション: [プレビュー] または [公開] ページで、バブルに表示されるグラフィックインタラクションスタイルをクリックします。 左側のアイコンをクリックして、グラフィックインタラクション機能を有効にします。

    • サイズ: スライダーをドラッグして、バブルのサイズ範囲を設定します。 有効な値: 1 ~ 2。

    • ハイライトカラー: インタラクション中のフライバイフライラインのハイライトカラー。

• Label: 飛行ルートレイヤーのラベルのスタイルを指定します。

  メトリクス	説明
  表示ラベル	スイッチをオンにすると、ラベルスタイルが飛行ルートレイヤーに表示されます。
  表示モード	飛行ルートレイヤーでのタグの表示モード。 [クリック] または [移動] を選択できます。
  表示ライン	ラベルインジケータの線スタイルを設定します。これには、飛行線の終わりに基づく線スタイル、水平線の割合、線スタイルなどが含まれます。 End Offset: 飛行線の終点に基づいて、インジケーター線の水平方向と垂直方向のオフセットを指定します。 範囲は-500から500です。 単位はpxです。 水平線比率: インジケータラインの水平線比率を0〜100の範囲で設定します。 線のスタイル: 線の種類、線の太さ、線の色を指定します。
  背景スタイル	飛行ルートレイヤーのタグの背景スタイルパラメーターを設定します。 背景スタイルパラメーターの左側にあるアイコンをクリックして、背景スタイルパラメーターの表示を制御します。 背景タイプ: タグの背景のタイプ。 [ベクター] または [画像] を選択できます。 背景色: タグの背景色を指定します。 このパラメーターは、[背景タイプ] を [ベクター] に設定した場合にのみ使用できます。 枠のスタイル: ラベルの枠のスタイル (線の種類、線の幅、枠の色など) を設定します。 このパラメーターは、Background TypeパラメーターをVectorに設定した場合にのみ使用できます。 Border Fillet: 4方向のラベル境界の丸みを帯びた角を指定します。 単位: ピクセル。 この設定は、[背景タイプ] に [ベクター] を選択した場合にのみ使用できます。 画像テンプレート: 背景画像のテンプレートスタイルを選択します。 このオプションは、[画像テンプレート] で [画像] を選択した場合にのみ使用できます。 不透明度: 背景画像の不透明度。 有効値: 0~100。 このパラメーターは、[イメージテンプレート] で [イメージ] を選択した場合にのみ使用できます。 Background Shadow: ラベルの背景の影のスタイル。影の色、影のぼかし値、およびx方向とy方向の影のオフセット値が含まれます。 背景シャドウの左側にあるアイコンをクリックすると、背景シャドウの表示を制御できます。 コンテンツマージン: タグ内のコンテンツとタグ内のコンテンツの間の距離を指定します。
  スタートラベル	フライングラインレイヤーの開始ラベルのコンテンツスタイルを設定します。 バブルスタイルの横にあるまたはアイコンをクリックして、各行のスタイルを追加または削除します。 またはアイコンをクリックして、1行に複数のコンテンツスタイルで表示レイアウトを設定します。 アイコンをクリックして、現在選択されているコンテンツスタイル設定をコピーし、同じ設定でコンテンツの新しい行を追加します。 行フィールド: 行フィールドの名前。 名前は、地理データのフィールド名と一致する必要があります。 フィールドスタイル: フィールドのフォントスタイル、フォントサイズ、色、太さなど、行フィールドのスタイルを指定します。 フィールドのプレフィックス: フィールドの内容、間隔、フォント、フォントサイズ、色、および重みを指定します。 [フィールドプレフィックス] の左側にあるアイコンをクリックして、[フィールドプレフィックス] の表示を制御します。 フィールド接尾辞: フィールド接尾辞の内容、間隔、フォント、フォントサイズ、色、および重みを指定します。 [Field Suffix] の左側にあるアイコンをクリックして、[Field Suffix] の値を制御します。 最大幅: ラベルで表示される1行の最大幅を指定します。 単位: ピクセル。 余分なコンテンツの表示モードは、テキストオーバーフロー設定項目によって決まります。 テキストオーバーフロー: 切り取りや改行など、タグ内のテキストオーバーフローを解決するために使用されるメソッド。 行高比率: タグの行高比率。 有効な値: 1 ~ 2。 Content Stroke: タグのコンテンツストロークスタイル (ストロークの色と重さを含む) 。 [コンテンツストローク] の左側にあるアイコンをクリックすると、[コンテンツストローク] の外観または隠蔽を制御できます。 Content Shadow: タグのコンテンツシャドウスタイル。シャドウの色、シャドウのぼかし値、x方向とy方向のシャドウのオフセット値を含みます。 コンテンツシャドウの左側にあるアイコンをクリックすると、コンテンツシャドウの表示を制御できます。
  ラベル	飛行ルートレイヤーの着地点ラベルのコンテンツスタイルを設定します。 バブルスタイルの横にあるまたはアイコンをクリックして、各行のスタイルを追加または削除します。 またはアイコンをクリックして、1行に複数のコンテンツスタイルで表示レイアウトを設定します。 アイコンをクリックして、現在選択されているコンテンツスタイル設定をコピーし、同じ設定でコンテンツの新しい行を追加します。 行フィールド: 行フィールドの名前。 名前は、地理データのフィールド名と一致する必要があります。 フィールドスタイル: フィールドのフォントスタイル、フォントサイズ、色、太さなど、行フィールドのスタイルを指定します。 フィールドプレフィックス: フィールドの内容、間隔、フォント、フォントサイズ、色、および重みを指定します。 [フィールドプレフィックス] の左側にあるアイコンをクリックして、[フィールドプレフィックス] の表示を制御します。 フィールドサフィックス: フィールドサフィックスの内容、間隔、フォント、フォントサイズ、色、および重みを指定します。 [Field Suffix] の左側にあるアイコンをクリックして、[Field Suffix] の値を制御します。 最大幅: ラベルで表示される1行の最大幅を指定します。 単位: ピクセル。 余分なコンテンツの表示モードは、テキストオーバーフロー設定項目によって決まります。 テキストオーバーフロー: 切り取りや改行など、タグ内のテキストオーバーフローを解決する方法を指定します。 行高比率: タグの行高比率。 有効な値: 1 ~ 2。 Content Stroke: タグのコンテンツストロークスタイル (ストロークの色と重さを含む) 。 [コンテンツストローク] の左側にあるアイコンをクリックすると、[コンテンツストローク] の外観または隠蔽を制御できます。 Content Shadow: タグのコンテンツシャドウスタイル。シャドウの色、シャドウのぼかし値、x方向とy方向のシャドウのオフセット値を含みます。 コンテンツシャドウの左側にあるアイコンをクリックすると、コンテンツシャドウの表示を制御できます。

• 条件: 条件スタイルの説明。

  条件付きスタイル: またはアイコンをクリックして、条件付きスタイルを追加または削除します。 またはアイコンをクリックして、複数の条件付きスタイルの配置スタイルを設定します。 アイコンをクリックして、選択した条件付きスタイル設定をコピーし、同じ設定の条件付きスタイルを追加します。 条件ツリーの設定方法の詳細については、「使用方法の注意事項」をご参照ください。

  グラフィック: スイッチをオンにすると、スタイルのグラフィック設定項目を設定できます。 スイッチをオフにすると、スタイルのグラフィック設定項目を設定できません。

  メトリクス	説明
  飛行ルートスタイル	線の種類、線の幅、飛行線の色、長さなど、飛行線の飛行線のスタイルを設定します。 アイコンを使用して、現在の条件が満たされたときに現在のスタイルが適用されているかどうかを確認できます。
  Serifスタイル	線の種類、線の幅、長さなど、飛行線のセリフスタイルを設定します。 アイコンを使用して、現在の条件が満たされたときに現在のスタイルが適用されているかどうかを確認できます。
  ヘッドスタイル	スレッドヘッダーのアイコンの形状や半径など、フライングラインのスレッドヘッダースタイルを設定します。 アイコンをして、現在の条件が満たされたときに現在のスタイルが適用されているかどうかを確認できます。

[データソース] パネル

高度なパネル

Blueprintインタラクション

1. 左上隅のアイコンをクリックして、ブループリントページに移動します。

2. [レイヤーノード] タブで、ウィジェットをメインキャンバスに追加します。

3. ブループリント設定パラメータを表示します。

   • イベント

     イベント	説明
     データインターフェイス要求が完了したとき	イベントは、データインターフェイス要求が応答され、フィルターによって処理された後、処理されたJSONデータでトリガーされます。 特定のデータ例の詳細については、キャンバスエディターの右側の構成パネルにある [データソース] タブの [データ応答結果] セクションをご参照ください。
     フライングラインがクリックされたとき	飛行ルートレイヤーで飛行ラインをクリックしたときに発生するイベント。 イベントはまた、飛行ラインに対応する経度および緯度データ項目を上げる。
     マウスが入ったとき	フライングラインレイヤーのフライングラインにマウスが移動したときにスローされるイベント。 イベントはまた、飛行ラインに対応する経度および緯度データ項目をスローする。

   • Action

     Action	説明
     データのインポート	ウィジェットのデータがその描画フォーマットに従って処理された後、ウィジェットは再描画のためにインポートされる。 サーバーデータを再度リクエストする必要はありません。 特定のデータ例の詳細については、キャンバスエディターの右側の構成パネルにある [データソース] タブの [データ応答結果] セクションをご参照ください。
     要求データインタフェース	このアクションは、サーバーデータを再度要求するために実行されます。 アップストリームデータ処理ノードまたはレイヤノードによって送信されたデータは、パラメータとして使用される。 たとえば、APIデータソースがhttps:// api.testで、リクエストデータインターフェイスに渡されるデータが { id: '1'} の場合、最終的なリクエストインターフェイスはhttps:// api.test?id=1です。
     スイッチ表示 /非表示	ウィジェットを表示するか非表示にするかを指定します。 パラメータは必要ありません。
     表示	ウィジェットを表示します。 詳細については、「データ例」をご参照ください。 { "animationType": "",// The animation method. Valid value: fade. If you do not specify this parameter, no animation is generated. "animationDuration": 1000,// The animation delay. Unit: ms. "animationEasing": ""// animation curve }
     非表示	コンポーネントを非表示にします。 詳細については、「データ例」をご参照ください。 { "animationType": "",// The animation method. Valid value: fade. If you do not specify this parameter, no animation is generated. "animationDuration": 1000,// The animation delay. Unit: ms. "animationEasing": ""// animation curve }
     コンポーネント設定の更新	ウィジェットのスタイル設定は動的に更新されます。 スタイルパネルで、[設定をクリップボードにコピー] をクリックしてウィジェットの設定データを取得します。 その後、Blueprint Editorでデータ処理ノードのスタイルフィールドを変更します。