Examples

更新时间:
复制 MD 格式

This topic provides two examples that demonstrate how to use the geo-tool with a basic flat map: Drill down by administrative region and Custom area drill-down.

Drill down by administrative region

This example shows how to create hierarchical drill-down data. The data uses existing administrative region borders in a Province > City > District/County hierarchy. It demonstrates the complete process of creating this hierarchy.

  1. Log on to the DataV console.

  2. In the DataV console, select a visualization application and click Edit.

  3. In the All Assets pane, select Map > Basic Flat Map and add it to the canvas editor.

  4. In the Configuration panel, click + Subcomponent Management, select Custom Area Drill-down Layer, and then click + Add Subcomponent.1

  5. Click the Custom Area Drill-down Layer sub-widget, navigate to the Data panel, and click Custom TopoJSON Data API.

  6. Log on to DataV.GeoAtlas and select Hierarchy Generator.

    1. In the root area, click the image icon to attach data.image

    2. In the window that appears, enter China. Do not select the Add all descendant nodes at the same time checkbox. Click Confirm.image

    3. Click the image icon to add a child node for the province level.

    4. In the window that appears, enter Zhejiang Province. Do not select the Add all descendant nodes at the same time checkbox. Click Confirm.

    5. To the right of the Zhejiang Province level, click the image icon. Add Hangzhou City and Shaoxing City to create the city level.

    6. To the right of the Hangzhou City level, click the image icon. Add Xihu District and Chun'an County to create the district/county level.

    7. To the right of the Shaoxing City level, click the image icon. Add Yuyao City and Xinchang County to create the district/county level.

    8. Click Export Hierarchy (DataV Only) to export and save the hierarchy JSON file to your computer.image

  7. Select the Custom Area Drill-down Layer. On its Data panel, in the Custom TopoJSON Data API section, click Configure Data Source.image

  8. Set Data Source Type to Static Data.image

  9. Open the hierarchy file that you downloaded from the geo-tool. Copy its content and paste it into the data entry window.

  10. To the right of the data response result, click the image icon to refresh the result.

  11. In the upper-right corner, click the Preview image icon to preview the configuration. Double-click an area to drill down. Double-click an unselected area to roll back.3月1日

Custom area drill-down

This example demonstrates how to create a custom drill-down hierarchy using drawn geometric shapes. The example starts with the administrative borders of Zhejiang Province and creates a hierarchy that drills down to Lingyin Temple in Hangzhou.

  1. Log on to the DataV console.

  2. In the DataV console, select a visualization application and click Edit.

  3. In the All Assets pane, select Map > Basic Flat Map and add it to the canvas editor.

  4. In the Configuration panel, click + Subcomponent Management, select Custom Area Drill-down Layer, and then click + Add Subcomponent.1

  5. Click the Custom Area Drill-down Layer sub-widget, navigate to the Data panel, and click Custom TopoJSON Data API.

  6. Log on to DataV.GeoAtlas and select Range Selector.

    1. In the map panel on the left, click the Zhejiang Province area. In the Select required data format module, click the Download image icon to save the Zhejiang Province map JSON file to your computer.image

    2. Select Border Generator. In the map panel on the left, click the image icon to import the saved JSON file.

    3. In the property table panel below, select Hangzhou City and click Locate to zoom in to the Hangzhou City area.image

    4. In the map panel on the left, click the image icon. Use the circular area tool to select the northeastern part of Hangzhou City. Change the name field to Northeastern Hangzhou.image

    5. In the property table panel below, select the circular area and click Locate to zoom in to the current area.image

    6. In the map panel on the left, click the image icon. Use the polygon tool to draw a border around the Hangzhou West Lake Scenic Area. Change the name field to West Lake Scenic Area.image

    7. Repeat the previous step. Within the West Lake Scenic Area, use the polygon tool to draw a border around the Lingyin Temple area, and then zoom in. Change the name field to Lingyin Temple.image

    8. In the property table panel, select each area and click Export GeoJSON. Export the GeoJSON files for Hangzhou City, Northeastern Hangzhou, West Lake Scenic Area, and Lingyin Temple to your computer.image

    9. Select Hierarchy Generator. For more information, see Hierarchy tree panel features. Attach the GeoJSON files for Zhejiang Province, Hangzhou City, Northeastern Hangzhou, West Lake Scenic Area, and Lingyin Temple to the hierarchy nodes in the correct order.image

    10. Click Export Hierarchy (DataV Only) to save the created hierarchy data to your computer.

  7. Select the Custom Area Drill-down Layer. On its Data panel, in the Custom TopoJSON Data API section, click Configure Data Source.image

  8. Set Data Source Type to Static Data.image

  9. Open the hierarchy file that you downloaded from the geo-tool. Copy its content and paste it into the data entry window.

  10. To the right of the data response result, click the image icon to refresh the result.

  11. In the upper-right corner, click the Preview image icon to preview the configuration. Double-click an area to drill down. Double-click an unselected area to roll back.3月1日(1)