DataV:マップコンテナ

設定パネル

• サブコンポーネントの管理

  • コンポーネントを追加するAdd a component

    1. 左側のナビゲーションウィンドウで、[基本フラットマップ] をクリックします。 [設定] タブが表示されます。

    2. [サブコンポーネント] の左側にあるアイコンをクリックします。

    3. 1つ以上の子コンポーネントを選択し、[子コンポーネントの追加] をクリックします。 コンポーネントを追加すると、[コンポーネントの管理] ページにコンポーネントが表示されます。

    4. 次の図に示すように、追加したサブコンポーネントをクリックし、サブコンポーネントパラメーターを設定します。

    5. 設定が完了したら、アイコンをクリックして基本フラットマップ設定パネルに戻り、他の子コンポーネントを設定します。

  • コンポーネントをコピー、名前変更、または削除するには、コンポーネントの上にポインターを移動し、アイコンをクリックしてコンポーネントをコピーします。 [] をクリックして、子ウィジェットの名前を編集します。 [] をクリックして、子ウィジェットを削除します。

    説明

    マップコンポーネントの管理方法の詳細については、「マップコンポーネントの管理」をご参照ください。

• [設定の検索]: キャンバスエディターの右側のパネルで、[設定] タブをクリックし、右上隅の [設定の検索] をクリックします。 検索ボックスに必要な設定項目を入力し、検索アイコンをクリックして設定項目をすばやく見つけます。 あいまい一致はサポートされていません。 詳細については、「設定の検索」をご参照ください。

• Size: ピクセルの幅と高さを含むウィジェットのサイズを示します。 アイコンをクリックすると、ウィジェットの幅と高さを比例調整できます。 このアイコンをもう一度クリックすると、必要に応じて幅と高さを調整できます。

• 位置: ウィジェットの位置。ピクセルXとYの座標で示されます。 X座標は、ウィジェットの左上隅とキャンバスの左枠の間のピクセル距離を示します。 Y座標は、ウィジェットの左上隅とキャンバスの上枠の間のピクセル距離を示します。

• 回転角度: ウィジェットの中心点を回転点として使用する回転の角度。 単位は度 (°) です。 次のいずれかの方法を使用して、ウィジェットの回転角度を制御できます。

  • 回転角度スピンボックスに角度を直接入力するか、プラス記号 ([+]) またはマイナス記号 ([-]) をクリックして、回転角度スピンボックスの値を増減します。

  • アイコンの黒い点をドラッグします。

  • アイコンをクリックして、ウィジェットを水平に反転します。

  • アイコンをクリックして、ウィジェットを垂直に反転します。

• 不透明度: ウィジェットの不透明度。 有効な値: 0と1。 このパラメーターが0に設定されている場合、ウィジェットは非表示になります。 このパラメーターが1に設定されている場合、ウィジェットは完全に表示されます。 デフォルト値: 1

• 無制限ズーム: この機能を有効にすると、マップはよりスムーズにズームします。 この機能を無効にすると、マップはよりスムーズにズームします。

• 高解像度レンダリング: 網膜画面でこの機能を有効にすると、超高解像度の適応が実現されます。 しかしながら、網膜スクリーンの性能は低下する。 この機能は、マシン構成に基づいて有効にできます。

• グローバル設定: 背景色、ズームレベル、マップセンターの緯度と経度、およびコントロールスケールのルーラーの隠蔽を設定します。

  パラメーター	説明
  マップの背景	マップの背景色。 詳細については、「カラーピッカーの手順」をご参照ください。
  地図ズーム	マップの親コンテナのズーム範囲とデフォルトレベルを制御します。 ズーム範囲: ズーム範囲は、親コンテナーのズーム範囲のみを制御します。 有効な値: 0〜20。 デフォルトレベル: 親コンテナのデフォルトレベル。 デフォルトレベルはズーム範囲内でなければなりません。 有効な値: 0〜20。 説明 マップズームは分数ズームをサポートしています。 ズームレベルは、親コンテナがズーム範囲内でのみ動作できることを制御し、デフォルトレベルは、親コンテナのデフォルト表示レベルを設定し、これは、ズーム範囲内で設定される必要がある。
  地図センター	地図の中心の緯度と経度。
  座標系	マップの座標系タイプ。 [ユニバーサル座標] または [カスタム] を選択できます。 共通座標: 共通座標には、EPSG3857、EPSG4326、およびBD09が含まれます。 デフォルトでは、システムは共通座標系をEPSG3857に設定します。 別の共通座標系に切り替える場合は、最下層に対応するタイルのURLをリセットする必要があります。 カスタム: EPSG、projパラメーター、経度原点、緯度原点、解像度などの座標系をカスタマイズできます。 カスタム座標系の詳細については、「カスタム座標系マップ」をご参照ください。
  スケールルーラー	スケールルーラーの右側のアイコンをクリックすると、スケールルーラーがマップ上に表示されます。 有効にすると、スケールルーラーのフォントの色、枠の色、およびスケールルーラーの水平方向と垂直方向のオフセット値を調整できます。

  データソースを設定して、マップの中心点とズームレベルを変更することもできます。

  例：

  [
       {
         "zoom": 4,
         "lng": 112,
         "lat": 34
       }
  ]

• ボックス設定: テキストスタイル、行の高さの比率、コーナーの半径などのパラメーターを設定できます。

  パラメーター	説明
  テキストスタイル	ダイアログボックスでテキストのフォント、太さ、フォントサイズ、色を設定します。 詳細については、「カラーピッカーの手順」をご参照ください。
  列の高さの比率	ダイアログボックスの行の高さの比率。 有効な値: 0.5〜5。
  フィレット半径	ダイアログボックスのフィレット半径を設定します。 値が大きいほど、フィレットラジアンは大きくなります。 有効な値: 0〜20。
  マージン	ダイアログボックス内のテキストとダイアログボックスの4辺の間の距離を設定します。
  背景色	ダイアログボックスの背景色を設定します。
  閉じるボタン	ポップアップボックスを閉じるようにボタンの色、ボタンのサイズ、ボタンとウィジェットボックスの上部の間の距離、およびボタンとウィジェットボックスの右側の間の距離を設定します。 有効値: 0~100。

• インタラクティブ設定: インタラクティブマップ機能のパラメーターを設定します。

  パラメーター	説明
  オープンドラッグ	スイッチをオンにして、マップドラッグ機能を有効にします。 [プレビュー] または [公開] ページで、マップをクリックしてドラッグできます。
  スケーリングの有効化	スイッチをオンにして、マップズーム機能を有効にします。 プレビューまたは公開ページで、マウスホイールをスクロールしてマップをズームできます。
  地図の相互作用	スイッチをオンにして、マップインタラクション機能を有効にします。 [プレビュー] または [公開] ページで、をクリックしてエリアにフォーカスし、そのエリアのデータ構成情報を表示できます。

データパネル

相互作用パネル

ウィジェット操作機能を有効にするには、[有効化] を選択します。 カスタム変数値は、map is movedおよびmap is movedのときにスローされます。 詳細は、「コールバックIDの設定」をご参照ください。

一部のサブコンポーネントは、地域のサーマルレイヤー、線密度マップレイヤー、スキャッタレイヤーなど、インタラクティブな構成、つまりコールバックIDをサポートしています。 コールバックIDを使用してマップを操作できます。 詳細については、「ウィジェットインタラクションの設定」および「コールバックIDの設定」をご参照ください。

Blueprint Editorでのインタラクションの設定

1. キャンバスエディターで、レイヤーパネルでウィジェットを右クリックし、[ブループリントエディターに追加] を選択します。

2. ページの左上隅にあるアイコンをクリックします。

3. Blueprint Editorで、[ノードのインポート] ペインで [基本フラットマップ] コンポーネントをクリックします。 次の図に示すように、キャンバス上で基本的なフラットマップ設定パラメーターを表示できます。

   • イベント

     イベント	説明
     データインターフェイス要求が完了したとき	イベントは、データインターフェイス要求が応答され、フィルターによって処理された後、処理されたJSONデータでトリガーされます。 特定のデータ例の詳細については、キャンバスエディターの右側の構成パネルにある [データ] タブの [データ応答結果] セクションをご参照ください。
     データインターフェイス要求が失敗した場合	データインターフェイス要求が失敗したときに返され (要求はネットワークの問題またはインターフェイスのエラーが原因である可能性があります) 、フィルターによって処理されるイベント。 イベントは、処理されたJSONデータもスローします。 特定のデータ例の詳細については、キャンバスエディターの右側の構成パネルにある [データ] タブの [データ応答結果] セクションをご参照ください。
     マップが移動するとき	マップの中心点が移動したときにスローされるイベント。 参照データの例を次に示します。 { // The latitude. lat: 38.5714 // Longitude lng: 106.5306 // The zoom level. zoom: 4.3 // The type of the trigger. type: "move_mouse" }
     マップ移動エンド	マップの中心点が移動したときに発生するイベント。 参照データの例を次に示します。 { // The latitude. lat: 38.5714 // Longitude lng: 106.5306 // The zoom level. zoom: 4.3 // The type of the trigger. type: "moveend_mouse" }

   • Action

     ポリシーアクション	説明
     要求データインタフェース	このアクションは、サーバーデータを再度要求するために実行されます。 アップストリームデータ処理ノードまたはレイヤノードによって送信されたデータは、パラメータとして使用される。 たとえば、基本フラットマップがAPIデータソースをhttp:// api.testとして設定され、リクエストデータインターフェイスに渡されるデータが { id: '1'} として設定されている場合、最終的なリクエストインターフェイスはhttp:// api.test?id=1です。
     データのインポート	ウィジェットのデータがその描画フォーマットに従って処理された後、ウィジェットは再描画のためにインポートされる。 サーバーデータを再度リクエストする必要はありません。 特定のデータ例の詳細については、キャンバスエディターの右側の構成パネルにある [データ] タブの [データ応答結果] セクションをご参照ください。
     表示	ウィジェットは、パラメータを指定する必要なしに表示されます。
     非表示	ウィジェットは、パラメータを指定する必要なしに非表示になります。
     セットビュー	マップビューのマップ中心点とズームレベルを設定します。 参照データの例は以下の通りである。 { // The zoom level, which must be within the set zoom level range. "zoom":4.5, // Longitude range:[-180,180] "lng":108, // Latitude range:[-180,180] "lat":38 }
     ズームレベルの設定	マップのズームレベルを設定します。 参照データの例は以下の通りである。 { // The zoom level, which must be within the set zoom level range. "zoom":4.5 }
     ズーム範囲の設定	マップのレベルズーム範囲を設定します。 参照データの例は以下の通りである。 { // Zoom level range: [minimum level, maximum level]. "range":[ 3, 18 ] }
     最大ビュー範囲の設定	マップの最大ビューの座標範囲を設定します。 参照データの例は以下の通りである。 { // Coordinate range:[[minimum latitude, minimum longitude],[maximum latitude, maximum longitude]] "bounds": [ [ 0, 72 ], [ 53, 138 ] ] }
     指定された位置に飛ぶ	フライトの緯度と経度、ズームレベルを指定された位置ポイントとフライトの時間間隔に設定します。 参照データの例は以下の通りである。 { // The zoom level, which must be within the set zoom level range. "zoom": 4.5, // Longitude range:[-180,180] "lng": 108, // Latitude range:[-90,90] "lat": 38, // gap. Unit: seconds. "duration": 0.25 }
     指定された範囲に飛ぶ	指定した範囲に飛行の座標範囲とフライトギャップを設定します。 参照データの例は以下の通りである。 { // Coordinate range:[[minimum latitude, minimum longitude],[maximum latitude, maximum longitude]] "bounds": [ [ 0, 72 ], [ 53, 138 ] ], // The time interval. Unit: seconds. "duration": 0.25 }
     コンポーネント設定の更新	ウィジェットのスタイル設定は動的に更新されます。 [設定] パネルで、[設定をクリップボードにコピー] をクリックして、コンポーネントの設定データを取得します。 その後、Blueprint Editorでデータ処理ノードのスタイルフィールドを変更します。
     スイッチを隠し状態	ウィジェットは非表示または表示されます。 参照データの例は以下の通りである。 { //true indicates that a widget is shown, whereas false indicates that a widget is hidden. "status": true, // Animation is displayed. "animationIn": { // The animation type, which can be set to fade. If it is not specified, no animation is displayed. "animationType": "fade", // The duration in which animation is displayed. It is in the unit of milliseconds. "animationDuration": 1000, // The function that is used to display animation. You can set this parameter to linear|easeInOutQuad|easeInOutExpo. "animationEasing": "linear" }, // Animation is hidden. "animationOut": { // The animation type, which can be set to fade. If it is not specified, no animation is displayed. "animationType": "fade", // The duration in which animation is hidden. It is in the unit of milliseconds. "animationDuration": 1000, // The function that is used to hide animation. You can set this parameter to linear|easeInOutQuad|easeInOutExpo. "animationEasing": "linear" } }
     移動	ウィジェットが指定された場所に移動されます。 参照データの例は以下の通りである。 { // The positioning type. to indicates absolute positioning, whereas by indicates relative positioning. The default value is to. "positionType": "to", // The location, which is indicated by the x and y coordinates. "attr": { "x": 0, "y": 0 }, // The animation type. "animation": { "enable": false, // The duration in which animation is displayed. "animationDuration": 1000, // The animation curve, which can be set to linear|easeInOutQuad|easeInOutExpo. "animationEasing": "linear" } }