fix(chart): Abstand zwischen X-Achsen-Ticks verbessert und letztes Datum sichtbar gemacht
- allowDataOverflow aktiviert, um letzte X-Achse-Ticks nicht abzuschneiden - rechtes margin (90px) im ComposedChart hinzugefügt - X-Achsen-Tick-Intervalle für bessere Lesbarkeit angepasst
This commit is contained in:
@@ -148,11 +148,16 @@ const LoopMeasurementChart = () => {
|
||||
return (
|
||||
<div style={{ width: "100%", height: isFullScreen ? "90%" : "400px" }}>
|
||||
<ResponsiveContainer width="100%" height="100%">
|
||||
<ComposedChart data={formatierteDaten}>
|
||||
<ComposedChart
|
||||
data={formatierteDaten}
|
||||
margin={{ right: 90, left: 20 }} // <- Platz für das letzte Label
|
||||
>
|
||||
<CartesianGrid strokeDasharray="3 3" />
|
||||
<XAxis
|
||||
dataKey="zeit"
|
||||
domain={["dataMin", "dataMax"]}
|
||||
allowDataOverflow={true} // <- wichtig, um letzten Tick nicht abzuschneiden
|
||||
interval={Math.floor(formatierteDaten.length / 15)}
|
||||
tickFormatter={(zeit) => {
|
||||
const date = new Date(zeit);
|
||||
return `${date.getDate()}.${date.getMonth() + 1}`;
|
||||
|
||||
Reference in New Issue
Block a user