How to drill down MAKit Chart with clicked category?

Question

In a SAPUI5 application I am using two XML views showing a Chart each with a model bound to an OData service.

On the first view I build the chart using the following code:

<ma:Chart id="idChart" height="90%" width="100%" type="Column"
    rows="{/MySet}" tap="onTapEvt">

    <ma:category>
        <ma:Category column="category" displayName="Category" />
    </ma:category>

    <ma:series>
        <ma:Series column="intervallSeries" displayName="Intervall"/>
    </ma:series>

    <ma:values>
        <ma:Value expression="mValue" displayName="Anzahl" />                               
    </ma:values>

    <ma:columns>
        <ma:Column name="category" value="{Category}" />
        <ma:Column name="intervallSeries" value="{Intervall}" />
        <ma:Column name="mValue" value="{Anzahl}" type="number" />
    </ma:columns>   
</ma:Chart> 

Let's assume I have four categories in my example chart named 'A', 'B', 'C' and 'D'. When I click on the category 'C' in the Chart I would like to show another Chart on the next page using the filtered data from my OData service by filtering on "Category eq 'C'". Therefore I use the function

onTapEvt: function(oEvent) {
        var selectedCategory = oEvent.oSource._selectedCatIdx;  // 2 when I select 'C'
        // --> How do I get Category value 'C' instead of selectedIndex 2 here <--
    app.to("nextPage", "slide", selectedCategory);
}

The object oEvent.oSource has all the MAKit Chart data in it, e.g. the selected index of the category in which I have clicked. Now I am searching for a way to read the bound value of Category with index 2 from the chart. Any ideas? In the SAPUI5 SDK I could not find a useful method for this.

Answer 1

You can use the following code to get the selected category :

var myChart = this.getView().byId("idChart");
var cat = myChart.getSelectedCategory();