Flexmonster supports creating multilevel hierarchies from non-hierarchical data out of the box. To use this feature for the custom data source API, you need to handle certain request scenarios on your server.
This guide describes how to support multilevel hierarchies on your server and configure them in the component.
Hierarchies are composed on the client side while the server's task is to filter them. For this purpose, your back end has to implement advanced hierarchical filters.
Flexmonster sends filters in the /members request and the /select requests for the pivot table, the flat table, and the drill-through view. The filters' structure depends on the custom data source API version implemented by your server (see how to check your version):
If the version sent in the response to the /handshake request is 2.8.22
or later, your server must support a filter structure described by the FilterGroupObject.
If the version sent in the response to the /handshake request is between 2.8.5
and 2.8.21
, your server must support a filter structure described by the FilterObject.
Note that the include.filter
and exclude.filter
properties of the FilterObject contain filters for hierarchical data. If you want to support multilevel hierarchies on your server, the server must be able to apply these filters to data.
When the server implements hierarchical filters, it should inform the component about that.
For this purpose, set the advanced property to true
in the response to the /fields request. The component will ignore multilevel hierarchies if the advanced
property is set to false
.
The component sends the additional /select request when the levelName
property is defined in the slice. This request extracts members from the hierarchy level specified in levelName
.
If you need the levelName
property in your slice, handle the /select request for loading the required hierarchy levels.
There are two ways to compose multilevel hierarchies:
The MappingObject is responsible for grouping data into hierarchies. Specify hierarchy
and parent
properties to structure the data.
The example below illustrates how to compose multilevel hierarchies in the report. Here, we create the "Item"
hierarchy with the "Category"
field as a first level and the "Color"
field as a second level:
report: { dataSource: { type: "api", url: "your_url", index: "your_index", mapping: { "Category": { type: "string", hierarchy: "Item" }, "Color": { type: "string", hierarchy: "Item", parent: "Category" } } }, slice: { // Your slice } }
As an alternative to the MappingObject, you can configure hierarchies right in the response to the /fields request. To do so, specify hierarchy and parent properties for the necessary fields.
Here is an example of a /fields response where the "Category"
and "Color"
fields are grouped under the "Item"
hierarchy (with "Category"
as the top level of the hierarchy):
{ "fields":[ { "uniqueName": "Category", "type": "string", "hierarchy": "Item" }, { "uniqueName": "Color", "type": "string", "hierarchy": "Item", "parent": "Category" }, // ... ], "aggregations":{ // ... }, "filters":{ // ... } }
Now run your project and open the webpage with Flexmonster - multilevel hierarchies should appear in the component.
Using the /handshake request, you can find out which version of the custom data source API your server implements:
2.8.5
to be your version of the custom data source API.See how to handle the /handshake request.
You may be interested in the following articles: