graphic
graphic copied to clipboard
How i can show just first and last time name on X axis
Hello im using your graphic package.I need show just first and last time value because it overflow when data is bigger.
Container(
margin: const EdgeInsets.only(top: 10),
height: 300,
child: Chart(
data: lineMarkerDataFonc(widget.myGraphicData, secilenDeger, sliderValue),
variables: {
'time': Variable(
accessor: (Map datum) => datum['time'] as String,
),
'value': Variable(
accessor: (Map datum) => datum['value'] as double,
),
},
elements: [
LineElement(
position: Varset('time') * Varset('value'),
color: ColorAttr(
variable: 'value',
values: [
const Color(0xff5470c6),
const Color(0xff91cc75),
],
),
),
],
axes: [
Defaults.verticalAxis,
Defaults.horizontalAxis,
],
),
),
Slider.adaptive(
divisions: 9,
min: 10,
max: 100,
value: sliderValue,
onChanged: ((value) {
setState(() {
sliderValue = value;
});
})),
Text(sliderValue.toString())
]));
}
}
lineMarkerDataFonc(List<Data> myGraphicData, Data? secilenDeger, double sliderValue) {
final List<Data> result = myGraphicData.where((element) => element.name == secilenDeger!.name).take(sliderValue.toInt()).toList();
List<Map<String, dynamic>> mapList = [];
int counter = 1;
result.forEach((element) {
mapList.add(
{
'counter': counter,
'name': element.name,
'time': DateFormat('HH:mm').format(element.lastUpdate),
'value': element.value,
},
);
counter++;
});
return mapList;
}
You can manually set the ticks of x axis with the Scale.ticks
of the x variable. Just put the first and last values in it. You can also just control the Scale.tickCount