DataV:情報ラベルレイヤー (v4.x)

チャートスタイル

情報ラベル層は、基本フラットマップ4.0のサブコンポーネントである。 グラフ形状のインジケーター線スタイルやメインアイコンスタイルなど、独立したスタイル、データ、およびインタラクション構成をサポートします。 これは、地理的位置のタグ情報コンテンツを情報アイコンの形で表すことができる。

スタイルパネル

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

• クイックスタイル: ビジネス要件に基づいてスタイルを選択できます。

• General: 情報タグ層の一般的な設定項目を指定します。

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

• グラフィック: 情報ラベルレイヤーのグラフィック設定項目を設定します。

  • Indicator Line: 情報ラベルレイヤーの行スタイルを示します。 左側のアイコンをクリックして、インジケーターの線スタイルをオンまたはオフにします。

    メトリクス	説明
    終了オフセット	情報ラベルレイヤーのインジケーター行の水平方向と垂直方向のオフセット値。 有効な値: -500から500。 単位: ピクセル
    水平ラインの割合	スライダーをドラッグして、インジケータラインの水平部分とインジケータライン全体の比率を設定します。 値の範囲は0〜100です。 単位: % 。
    ラインスタイル	スライダーをドラッグして、線の種類、線の色、線の太さの値など、示された線の線スタイルを設定します。 値の範囲はpxで0から20です。 説明 ラインタイプは、4,4などの数値入力をサポートします。 第1の数字は実線の長さを示し、第2の数字は間隔の長さを示す。

  • メインアイコン: タグ内のメインアイコンのスタイル。 左側のアイコンをクリックして、メインアイコンスタイルを有効または無効にします。

    メトリクス	説明
    アイコン形状	情報ラベルレイヤーのラベルにあるメインアイコンの形状。 [スタイル] の横にあるドロップダウンリストをクリックして、さまざまな組み込みアイコンスタイルを選択できます。 ドロップダウンパネルの入力ボックスに画像のURLを入力して、リモートサーバー上の画像をラベルアイコンとして使用することもできます。 入力ボックスの右側にあるアイコンをクリックして、ローカル画像をラベルアイコンとしてアップロードすることもできます。
    アイコンサイズ	メインアイコンの幅と高さを設定します。 有効値は 0 ～ 200 です。 単位: ピクセル

• ラベル: 情報ラベルレイヤーのラベルのスタイル。

  • 全体の幅: タグの全体の幅を設定します。 有効な値: AdaptiveおよびFixed Width。 [アダプティブ] を選択すると、全体の幅が自動的にマップウィジェットのサイズに合わせられます。 最大幅をカスタマイズできます。 有効値：20〜500。 単位: ピクセル。 [固定幅] を選択した場合、固定幅の値を指定できます。 有効値：20〜500。 単位: ピクセル。

  • メインタイトル: タグ内のメインタイトルのスタイル。 メインタイトルの左側にあるアイコンをクリックすると、メインタイトルの表示を制御できます。

    メトリクス	説明
    タイトルフィールド	タグのタイトルフィールドの内容を指定します。これは、地理データのフィールド名と一致する必要があります。 デフォルト値はnameフィールドです。
    テキストスタイル	テキストのフォントスタイル、フォントサイズ、色、太さなど、タグタイトルのテキストのスタイルを設定します。
    タイトルの背景	タグのメインタイトル内の背景スタイルを設定します。 背景色: タグのメインタイトルの背景色。 枠のスタイル: ラベルタイトルの枠のスタイル (線の種類、線の幅、枠の色など) を設定します。 Border Fillet: タグのメインタイトルの境界の丸みを帯びた角を4方向に指定します。 単位: ピクセル コンテンツマージン: タグ内のタイトルのコンテンツとコンテンツの上下左右の距離を指定します。

  • メインコンテンツ: タグ内のメインコンテンツのスタイルを指定します。 メインコンテンツセクションの左側にあるアイコンをクリックすると、メインコンテンツスタイルの表示を制御できます。

    メトリクス	説明
    スタイル /ライン	[Style per Line] の右側にあるまたはアイコンをクリックして、各行のスタイルを追加または削除します。 またはアイコンをクリックして、行ごとに複数のコンテンツスタイルの配置を設定します。 アイコンをクリックして選択したコンテンツスタイルをコピーし、同じ設定でコンテンツスタイルを追加します。 行フィールド: 行フィールドの名前。データパネルのフィールドと一致する必要があります。 フィールドスタイル: フィールドのフォントスタイル、フォントサイズ、色、太さなど、行フィールドのスタイルを指定します。 フィールドプレフィックス: フィールドの内容、間隔、フォント、フォントサイズ、色、および重みを指定します。 [フィールドプレフィックス] の左側にあるアイコンをクリックして、[フィールドプレフィックス] の表示を制御します。 フィールドサフィックス: フィールドサフィックスの内容、間隔、フォント、フォントサイズ、色、および重みを指定します。 [Field Suffix] の左側にあるアイコンをクリックして、[Field Suffix] の値を制御します。
    列の高さの比率	タグの行の高さの比率。 有効な値: 1 ~ 2。
    コンテンツの背景	タグのメインコンテンツの背景スタイルを設定します。 背景色: タグのメインコンテンツの背景色。 枠のスタイル: ラベルのメインコンテンツの枠のスタイル (線の種類、線の幅、枠の色など) を設定します。 Border Fillet: タグのメインコンテンツの境界の丸い角。 単位: ピクセル。 コンテンツマージン: タグのメインコンテンツのコンテンツと上下左右のコンテンツの間のマージン。

  • 背景フレーム: タグに背景フレームのスタイルを設定します。 背景フレームの左側にあるアイコンをクリックすると、背景フレームスタイルの表示を制御できます。

    メトリクス	説明
    背景タイプ	タグの背景ボックスの背景タイプ。 Valic values: VectorとImage。
    背景色	タグの背景色。 このパラメーターは、[背景タイプ] に [ベクター] を選択した場合にのみ使用できます。
    画像テンプレート	背景画像のテンプレートスタイル。 このパラメーターは、[イメージテンプレート] を [イメージ] に設定した場合にのみ使用できます。
    不透明度	背景画像の不透明度。 有効値: 0~100。 このパラメーターは、[イメージテンプレート] で [イメージ] を選択した場合にのみ使用できます。
    ボーダースタイル	ラベルの背景の境界線のスタイル。 境界線のスタイルには、線の種類、線の幅、色が含まれます。 このパラメーターは、[背景タイプ] を [ベクター] に設定した場合にのみ設定できます。
    ボーダーフィレット	4方向のラベル背景境界の丸みを帯びた角の値。 単位: ピクセル このパラメーターは、Background TypeパラメーターをVectorに設定した場合にのみ使用できます。
    コンテンツマージン	ラベルの背景ボックス内のコンテンツと上下左右の距離を設定します。

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

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

  グラフィック: 情報ラベルレイヤーのグラフィックのスタイルを指定します。 Graphの左側にあるアイコンをクリックして、指定した条件で情報ラベルレイヤーの対応するグラフの表示を制御します。

  • Indicator Line: この状態の情報ラベルレイヤーのインジケーターラインスタイル。 左側のアイコンをクリックして、インジケーターの線スタイルをオンまたはオフにします。

    メトリクス	説明
    終了オフセット	情報ラベルレイヤーのインジケーター行の水平方向と垂直方向のオフセット値。 有効な値: -500から500。 単位: ピクセル
    水平ラインの割合	スライダーをドラッグして、インジケータラインの水平部分とインジケータライン全体の比率を設定します。 値の範囲は0〜100です。 単位: % 。
    ラインスタイル	スライダーをドラッグして、線の種類、線の色、線の太さの値など、示された線の線スタイルを設定します。 値の範囲は、% で0〜20である。 説明 ラインタイプは、4,4などの数値入力をサポートします。 第1の数字は実線の長さを示し、第2の数字は間隔の長さを示す。

  • メインアイコン: タグ内のメインアイコンのスタイル。 左側のアイコンをクリックして、メインアイコンスタイルを有効または無効にします。

    メトリクス	説明
    アイコン形状	情報ラベルレイヤーのラベルにあるメインアイコンの形状。 [スタイル] の横にあるドロップダウンリストをクリックして、さまざまな組み込みアイコンスタイルを選択できます。 ドロップダウンパネルの入力ボックスに画像のURLを入力して、リモートサーバー上の画像をラベルアイコンとして使用することもできます。 入力ボックスの右側にあるアイコンをクリックして、ローカル画像をラベルアイコンとしてアップロードすることもできます。
    アイコンサイズ	メインアイコンの幅と高さを設定します。 有効値は 0 ～ 200 です。 単位: ピクセル

[データソース] パネル

高度なパネル

このコンポーネントにはイベント設定がありません。

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でデータ処理ノードのスタイルフィールドを変更します。