Add Custom Panel

The dashboard supports the addition of Custom Panel. Users can use the Custom Panel function through Secondary Development to meet the application needs of users in different scenarios.

The following will take the custom tree control as an example to introduce how to customize the development tree control, and when clicking the tree node, the map will synchronously locate and display the corresponding area.

Main operating instructions

1. Custom Development Implementation Tree Control Panel

public class DCustomTreePanel extends DAbstractCustomPanel      
    
      final DefaultMutableTreeNode currentNode = new ScaleNode(s.trim());
      final int nodeLevel = getNodeLevel(s);
      if (nodeLevel == -1) {
         continue;
      }
      if (nodeLevel == 0) {
         root.add(currentNode);
      } else {
         getBeforeNode(root, nodes, nodeLevel).add(currentNode);
      }
      insertChildNode(currentNode, nodes, nodeLevel);      
    
      DesktopMapControl mapControl = ((DMapPanel) ((FormDashboard) getFormDashboard()).getPanelGrid().getParameters(DParameterType.MAP).get(0)).getMapControl();
      mapControl.getMap().setScale(scaleNode.scale);
      mapControl.getMap().setViewBounds(scaleNode.bounds);
      mapControl.getMap().refresh();
      
  1. Inherit the DAbstact CustomPanel base class, and build the panel of the custom tree control in the dashboard based on the encapsulated template.
  2. Register the custom tree Control Type in the drop-down options for selection. After registration, you can select the Tree Control type from the Custom Type drop-down options on the Properties panel, as shown:
     DashboardManger.getInstance().addCustomType(actionTreeType);  
    
  3. The tree is constructed according to the text structure in the tree Control Attribute. Each line is parsed as a tree node, and the space at the beginning of the line is parsed as the hierarchical relationship of the tree. For example, the beginning of the second line B is indented by a space compared with the first line A. After being parsed as a tree node, B is the child node of A. The core code for building a tree node is as follows:
  4. In response to the selection event of the tree node, when the tree node is selected, the map Visible Bounds: is changed according to the scale and Map Bounds specified in the tree Node Properties to implement the Map Location. The core code is as follows:

2. Configure Map Bounds in Theater City

Add a Custom Panel in the dashboard, set the Control Type as Tree Control, set the level, name, Map Scale and Visible Bounds of the tree control in the Custom Control Attribute, and one space indicates one level of indentation. Set the map's scale and Visible Bounds with the scale and bounds properties.

3. Preview dashboard

Preview the dashboard, select different cities in the custom tree control, Switch Map to the specified range, and switch to the following figure:

Related Topics

Add Map

Add Diagram

Add Dashboard

Add Picture

Add Video

Add Split Line

Add Button

Add Drop-down Button