リージョナルサーマルレイヤー (V1.x) - DataV - Alibaba Cloud ドキュメントセンター

局所的な熱層は、基本フラットマップのサブコンポーネントである。地域ラベル、色、エッジ、マウスインタラクションイベント、位置情報など、独立したスタイル、データ、インタラクション構成をサポートしています。地域情報を熱地域の形で表示できます。このトピックでは、コロプレスレイヤーの設定項目について説明します。

コンポーネントの [Choropleth Layer] をクリックします。 コロプレスレイヤーの [設定] タブが表示されます。

説明

ComponentsにChoropleth Layerが含まれていない場合は、Choropleth Layerコンポーネントを追加します。詳細については、「マップコンテナ」をご参照ください。

パラメーター

[設定の検索]: キャンバスエディターの右側のパネルで、[設定] タブをクリックし、右上隅の [設定の検索] をクリックします。検索ボックスに必要な設定項目を入力し、検索アイコンをクリックして設定項目をすばやく見つけます。あいまい一致はサポートされていません。詳細については、「」をご参照ください。
ラベル
- ラベリングフィールド: リージョンのラベリングフィールド。ラベリングフィールドは、地理データのフィールド名と一致する必要があります。
- [色]：ラベルの色。詳細については、「カラーピッカーの説明」をご参照ください。
- [影の色] ：ラベルの影の色を設定します。
- フォント: ラベルのフォントファミリ。
  説明
  システムにインストールされているフォントのみが表示されます。選択したフォントがシステムにインストールされていない場合は、デフォルトのフォントが表示されます。
- [フォントサイズ] ：ラベルのフォントサイズ。
[塗りつぶしの色] ：Minimum、Maximum、No Data パラメーターの値に対応するエリアの色。
エッジオプション: リージョナルサーマルレイヤーの各領域のエッジの色、太さ、および破線の種類。
インタラクティブ設定
- [ポイントしたとき] ：カーソルをあわせたときにエリアを強調表示するための色。この効果は、レイヤーのプレビュー時、またはレイヤーのパブリッシュ後にのみ表示されます。
- ポップアップウィンドウを表示: スイッチをオンにすると、ポップアップウィンドウの情報が表示されます。スイッチをオフにすると、ポップアップウィンドウの情報が閉じられます。
- Click to Focus: スイッチをオンにして、click to focus機能を有効にします。
- Focus Range Ratio: クリックしたエリアのフォーカス範囲。
- コールバックID: ウィジェット間でデータをリンクするために使用される変数。このパラメーターをデータのフィールドに設定します。
  説明
  ウィジェットのバージョンが最新でない場合は、ウィジェットxxxをアップグレードし、[インタラクション] タブでコールバックIDを設定します。

フィルタリングテーブルのメタデータ。

Geo-boundary geoJSON data interface: geo-boundary geoJSON data interfaceを設定して、抽出したリージョンgeoJSON境界データをDataVに適用できます。設定方法は次のとおりです。
1. データ抽出。
  GeoJSONを使用して、行政区画の境界にウィジェットDataV.GeoAtlasを抽出します。最下位レベルでは、地区および郡レベルの境界データを抽出できます。地域のアドコードは、地方および都市のアドコードと経度および緯度のマッピングテーブルを参照できます。抽出方法は以下の通りである。
  - 地方: デフォルトでは、地域の熱層は全国的に表示され、各州および市町村の地域の熱層データを直接使用できます。
  - 県レベル: 浙江省のすべての県レベルの都市の境界データを例に取ります。
  - 地区と郡レベル: 例として、趙清市の範囲内のすべての地区と郡の境界データを取ります。
  - タウンシップストリートとカスタムリージョン: タウンシップストリートのデータを自分で取得する必要があります。必要に応じてリージョンの境界をカスタマイズします。たとえば、中国本土は、東部地域、西部地域、中国南部地域、中国北部地域、中国中部地域の5つの地域に分割でき、対応する州の境界データをマージすることで取得できます。
2. データアプリケーション。
  抽出されたデータを次のようにDataVに設定します。
  1. [Regional Thermal Layer] > [Data] > [Geo-boundary geojson Data Interface] を選択します。
  2. [データソースの設定] をクリックします。表示される [データソースの設定] ダイアログボックスで、[データソースタイプ] を [API] に設定します。
  3. 抽出したJSON APIをデータ入力エリアに貼り付けます。
    上の図では、Zhaoqing内のサブエリアの境界情報が抽出されています。サンプルAPIは次のとおりです。
```
https://geo.datav.aliyun.com/areas/bound/441200_full.json
```
  4. ダッシュボードにプロジェクトを公開します。設定されたリージョンサーマルレイヤーを表示できます。
データ構成中に、領域テキストラベルがオフセットされてもよい。解決策は次のとおりです。
- リージョンサーマルレイヤーのバージョンを確認してください。現在、利用可能な地域熱層コンポーネントには、地域熱層v0.2.4以降が含まれます。以前のバージョンのリージョナルサーマルレイヤーを使用する場合は、レイヤーを削除して再度追加する必要があります。
- GeoJSON抽出ツールのデータが更新されました。新しいGeoJSONデータファイルを使用する必要があります。
- 1つ以上のパラメーターの値を変更します。
  たとえば、地区および郡レベルでの趙慶市のGeoJSONデータは、Gaoyao地区のテキストでオフセットでマークされます。
  1. DataV.GeoAtlas boundary generatorツールを使用して、ZhaoqingのGeoJSONデータファイルを地区および郡レベルでアップロードし、プロパティシートパネルにcustomLabelPositionプロパティパラメーターを追加します。
    [プロパティシート] パネルで、[ハイライト] セクションでパラメーターを見つけ、customLabelPosition属性列を編集して追加し、カスタム "customLabelPosition": [112.500801,22.927694] プロパティを追加します。
  2. 変更内容を保存したら、GeoJSONファイルをローカルコンピューターにダウンロードし、GeoJSONファイルをサーバーまたはOSSにアップロードして新しいAPIを生成します。
  3. [Regional Thermal Layer] > [Data] > [Geo-boundary geojson Data Interface] を選択します。
  4. [データソースの設定] をクリックします。 [データソースの設定] パネルで、[データソースタイプ] を [API] に設定します。
  5. 新しく生成されたJSON API URLをデータ入力領域に貼り付けます。 API URLを設定すると、[ハイライトとハイライト] エリアのマークアップが期待どおりに表示されます。

熱値インターフェイス

ヒート値データインターフェイスを設定することで、リージョナルヒート層のスタイルをカスタマイズできます。リージョナルサーマルレイヤは、データ優先レンダリングをサポートする。

[Regional Thermal Layer] > [Data] > [Thermal Value Data Interface] を選択します。

[Data Source Type] を [Static Data] に設定します。

上の図のサンプルコード:

[
  {
    "area_id": "710000" 、
    "value": 64
  },
  {
    "area_id": "330000" 、
    "value": 388
  },
  {
    "area_id": "150000" 、
    "value": 82
  },
  {
    "area_id": "210000" 、
    "value": 478
  },
  {
    "area_id": "220000" 、
    "value": 491
  },
  {
    "area_id": "230000" 、
    "value": 849
  },
  {
    "area_id": "310000" 、
    "value": 273
  },
  {
    "area_id": "320000" 、
    "value": 656
  },
  {
    "area_id": "340000" 、
    "value": 157
  },
  {
    "area_id": "350000" 、
    "value": 764
  },
  {
    "area_id": "360000" 、
    "value": 797
  },
  {
    "area_id": "370000" 、
    "value": 337
  },
  {
    "area_id": "410000" 、
    "value": 32
  },
  {
    "area_id": "420000" 、
    "value": 225
  },
  {
    "area_id": "430000" 、
    "value": 693
  },
  {
    "area_id": "440000" 、
    "value": 19
  },
  {
    "area_id": "450000" 、
    "value": 141
  },
  {
    "area_id": "460000" 、
    "value": 906
  },
  {
    "area_id": "650000" 、
    "value": 904
  },
  {
    "area_id": "810000" 、
    "value": 526
  },
  {
    "area_id": "820000" 、
    "value": 407
  }
]

表1. 説明

項目	説明
area_id	リージョンのアドコード。DataV.GeoAtlasで取得できます。
値	エリアの値。これは、対応する領域の色を制御するために、設定パネルの塗りつぶし色の最大値、最小値、およびデータ設定項目の値なしで使用できます。説明 16 進数のカラー値の範囲は、データソースの value プロパティの値の範囲に基づいて計算されます。
info	オプションです。ポップアップウィンドウの内容。

データソースでは、color (線の色) 、weight (線幅) 、dashArray (点線) 、fillColor (塗りつぶしの色) などのフィールドを設定することもできます。
マップ内の対応する領域は、設定したパラメーターに従ってレンダリングされます。 fillColorは、red、#fff000、rgba(0,256、0,0) 形式のパラメーターを設定できます。

表1. パラメーター

パラメーター	説明
制御モード	スイッチをオンにすると、ウィジェットの初期化時にデータが要求されません。データリクエストは、コールバックIDまたはBlueprint Editorで設定されたメソッドに基づいてのみトリガーされます。スイッチをオフにすると、データ要求が自動的にトリガーされます。デフォルトでは、スイッチはオフになっています。
自動データ要求	[自動データ要求] チェックボックスをオンにすると、動的ポーリングを有効にし、ポーリング間隔を手動で指定できます。このチェックボックスをオンにしないと、データは自動的に要求されません。手動でページを更新してデータを要求するか、Blueprint EditorまたはコールバックIDイベントを使用してデータ要求をトリガーする必要があります。
データソース	キャンバスエディターの右側のパネルで、[データ] タブをクリックします。 [静的データ] の横にある [設定] をクリックします。 [Configure Datasource] パネルで、[data source Type] ドロップダウンリストからデータソースを選択します。コードエディターでデータクエリのコードを入力し、[データ応答のプレビュー] をクリックしてデータソースの応答をプレビューし、応答を表示します。詳細については、「資産データの設定」をご参照ください。
データフィルター	[データフィルタ] チェックボックスをオンにすると、データ構造の変換、データのフィルタリング、および簡単な計算を実行できます。 [フィルターの追加] の横にあるプラス記号 (+) をクリックすると、表示されるエディターでデータフィルターのスクリプトを設定できます。詳細については、「」をご参照ください。
データ応答結果	データ要求に対する応答。データソースが変更された場合は、[データ応答結果] の横にあるアイコンをクリックして、データ応答をリアルタイムで表示できます。

相互連携

ウィジェット間のインタラクションを有効にするには、[有効化] チェックボックスをオンにします。 Regional Thermal Layerコンポーネントには、インタラクティブな構成があります。エリアをクリックするか、エリアにマウスを移動するか、エリアからマウスを移動すると、データ要求がトリガーされ、コールバック値がスローされます。この方法では、エリアをクリックしたり、エリアにマウスを移動したり、エリアからマウスを移動したりすると、さまざまなエリアのデータが動的に読み込まれます。デフォルトでは、クリックしたリージョンのarea_id値が返されます。詳細については、「ウィジェットのコールバックIDの設定」をご参照ください。

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

キャンバスエディターで、基本フラットマップウィジェットの [リージョナルサーマルレイヤー] の横にあるアイコンをクリックします。
ページの左上隅にあるアイコンをクリックします。

ブループリントエディターで、[追加されたノード] ペインで [Choropleth Layer] をクリックします。キャンバス上のコロプレスレイヤーのパラメーターを設定できます。

イベント

イベント	説明
geo-boundary geojsonデータインターフェイス要求が完了したとき	geo-boundary geojsonデータインターフェイス要求の後にスローされるイベントが返され、フィルターによって処理されます。また、処理されたJSON形式のデータをスローします。特定のデータについては、「データ」をご参照ください。
熱値データインタフェース要求が完了したとき	発熱量データインターフェイス要求の後にスローされるイベントが返され、フィルターによって処理されます。また、処理されたJSON形式のデータをスローします。特定のデータについては、「データ」をご参照ください。
リージョンをクリックしたとき	リージョナルヒーティングレイヤーの領域をクリックしたときに発生し、処理のために下流のコンポーネントに送信されるイベントパラメーター。
マウスをリージョンに移動してトリガー	マウスがエリアヒートレイヤーのエリアブロックに移動すると、イベントがトリガーされ、データがスローされます。
マウスがリージョン外に移動したときのトリガー	エリア・ヒート・レイヤーのエリア・ブロックからマウスが移動すると、イベントがトリガーされ、データがスローされます。

ポリシーアクション

Action	説明
geo-boundary geojson data interfaceのリクエスト	このアクションは、サーバーデータを再度要求するために実行されます。アップストリームデータ処理ノードまたはレイヤノードによって送信されたデータは、パラメータとして使用される。たとえば、APIデータソースが`http:// api.test`で、要求地理境界geojsonデータインターフェイスに渡されるデータが `{ id: '1'}` の場合、最終的な要求インターフェイスは`http:// api.test?id=1`です。
リクエスト熱値インターフェイス	このアクションは、サーバーデータを再度要求するために実行されます。アップストリームデータ処理ノードまたはレイヤノードによって送信されたデータは、パラメータとして使用される。たとえば、APIデータソースが`http:// api.test`で、Request Heat Value data Interfaceに渡されるデータが `{ id: '1'}` の場合、最終的なリクエストインターフェイスは`htp:// api.test?id=1`です。
geo-boundary geojsonデータインターフェイスのインポート	ウィジェットのデータがその描画フォーマットに従って処理された後、ウィジェットは再描画のためにインポートされる。サーバーデータを再度リクエストする必要はありません。特定のデータについては、「データ」をご参照ください。
热価データのインポート	ウィジェットのデータがその描画フォーマットに従って処理された後、ウィジェットは再描画のためにインポートされる。サーバーデータを再度リクエストする必要はありません。特定のデータについては、「データ」をご参照ください。
表示	ウィジェットは、パラメータを指定する必要なしに表示されます。
非表示	ウィジェットは、パラメータを指定する必要なしに非表示になります。