javascriptfluttersyncfusiondrilldown

Is there any way to implement drill down in flutter?



Solution

  • Your requirement can be achieved using the onPointTapped event. In this event, you can get the point index on which you have tapped. With this information, you can render the chart based on your requirement. After drill down, we have provided an icon with a back arrow, can be used to get back to the actual chart. Find the code below to accomplish this.

    SfCircularChart(
     onPointTapped: (PointTapArgs args) {
          getDrilledChart(args.pointIndex);
     }
    //Other configurations,
    )
    

    The sample for reference can be found below.

    Drill down sample

    Screenshot before drill down

    Before

    Screenshot after drill down

    After