builder property

ChartTrackballBuilder? builder
final

Builder of the trackball tooltip.

Add any custom widget as the trackball template.

If the trackball display mode is groupAllPoints or nearestPoint it will called once and if it is floatAllPoints, it will be called for each point.

Defaults to null.

Widget build(BuildContext context) {
   return Container(
       child: SfCartesianChart(
          trackballBehavior: TrackballBehavior(
          enable: true,
          builder: (BuildContext context, TrackballDetails trackballDetails) {
          return Container(
                       height: _selectDisplayMode ==
                                   TrackballDisplayMode.floatAllPoints ||
                               _selectDisplayMode ==
                                   TrackballDisplayMode.nearestPoint
                           ? 50
                           : 75,
                       width: 100,
                       decoration: const BoxDecoration(
                           color: Color.fromRGBO(66, 244, 164, 1)),
                       child: Row(
                         children: <Widget>[
                           Container(
                               width: 50,
                               child: Image.asset('images/bike.png')),
                           _selectDisplayMode ==
                                       TrackballDisplayMode.floatAllPoints ||
                                   _selectDisplayMode ==
                                       TrackballDisplayMode.nearestPoint
                               ? Container(
                                   width: 50,
                                   child: Column(
                                    children: <Widget>[
                                       Container(
                                           height: 25,
                                           alignment: Alignment.center,
                                           child: Text(
                                               '${trackballDetails.point.x.toString()}')),
                                       Container(
                                           height: 25,
                                           alignment: Alignment.center,
                                          child: Text(
                                               '${trackballDetails.point.y.toString()}'))
                                     ],
                                   ))
                               : Container(
                                   width: 50,
                                   child: Column(
                                     children: <Widget>[
                                       Container(
                                           height: 25,
                                           alignment: Alignment.center,
                                           child: Text(
                                               '${trackballDetails.dataValues[0].toString()}')),
                                       Container(
                                           height: 25,
                                           alignment: Alignment.center,
                                           child: Text(
                                               '${trackballDetails.dataValues[1].toString()}')),
                                       Container(
                                           height: 25,
                                           alignment: Alignment.center,
                                           child: Text(
                                               '${trackballDetails.dataValues[3].toString()}'))
                                     ],
                                   ))
                        ],
                       ));
        }),
       ));
}

Implementation

final ChartTrackballBuilder<dynamic>? builder;