builder property
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;