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 (
|
return (
|
||||||
<div style={{ width: "100%", height: isFullScreen ? "90%" : "400px" }}>
|
<div style={{ width: "100%", height: isFullScreen ? "90%" : "400px" }}>
|
||||||
<ResponsiveContainer width="100%" height="100%">
|
<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" />
|
<CartesianGrid strokeDasharray="3 3" />
|
||||||
<XAxis
|
<XAxis
|
||||||
dataKey="zeit"
|
dataKey="zeit"
|
||||||
domain={["dataMin", "dataMax"]}
|
domain={["dataMin", "dataMax"]}
|
||||||
|
allowDataOverflow={true} // <- wichtig, um letzten Tick nicht abzuschneiden
|
||||||
|
interval={Math.floor(formatierteDaten.length / 15)}
|
||||||
tickFormatter={(zeit) => {
|
tickFormatter={(zeit) => {
|
||||||
const date = new Date(zeit);
|
const date = new Date(zeit);
|
||||||
return `${date.getDate()}.${date.getMonth() + 1}`;
|
return `${date.getDate()}.${date.getMonth() + 1}`;
|
||||||
|
|||||||
@@ -6,5 +6,5 @@
|
|||||||
2: Patch oder Hotfix (Bugfixes oder kleine Änderungen).
|
2: Patch oder Hotfix (Bugfixes oder kleine Änderungen).
|
||||||
|
|
||||||
*/
|
*/
|
||||||
const webVersion = "1.6.149";
|
const webVersion = "1.6.150";
|
||||||
export default webVersion;
|
export default webVersion;
|
||||||
|
|||||||
Reference in New Issue
Block a user