Example of Using the Chart With Changeable Radius

The chart with changeable sector radius has two available metrics:

Sector angle is a metric set in the EaxRadiusAngleChartView.Props property and determined by one of the columns settings.
Sector radius is a standard metric of a pie chart.

Executing the example requires the kapBox component (See Example of the KapBox Component Layout). The repository must contain express report set on the chart view containing several columns.

Step 1

Improve creation code of the kapBox component, before the line of the component creation:

kapBox = new Kap.KapBox ...

Add registration code of the plugin set for the first column:

Kap.regPluginBlock({
      Id: "RadiusAngleChart",
      Name: "RadiusAngleChart",
      View: "PP.Exp.Ui.EaxRadiusAngleChartView",
      SourceClass: PP.App.ModuleType.Olap,
      Js: "../build/PP.RadiusAngleChartPlugin.js",
      Props: {
          pluginProps: { AnglePointIndex: "0" }
      }
});

In this case it will be possible to add a plugin to dashboard.

Step 2

To add plugin, use the button Pluginon the Insert tool ribbon tab.

Step 3

After adding a plugin, select chart data source: express report with set chart.

After executing the example, the chart using the first column as angle factor will be created, the first column will also used to display radius which was not hidden by the AnglePointVisible property.

To access properties of created block, it is necessary to get block instance. Hide column used as sector angle:

props = block.getProps();
props.AnglePointVisible = false;
block.setProps(props);

After executing the code, the first column will not be displayed in radius factors because it is used in the angle factor.