VictoryChart/ignoriert VictoryLine Polsterung Einstellung

Question

Gegeben Ich habe diese Grafik-Konfiguration:

const data = [ 
    { x: 1, y: 13000 }, 
    { x: 2, y: 16500 }, 
    { x: 3, y: 14250 }, 
    { x: 4, y: 19000 }, 
    { x: 5, y: 19302 } 
]; 


    <VictoryChart padding={0} height={200} style={{ display: "block" }}> 

    <VictoryAxis 
     style={{ 
     axis: { display: "none" }, 
     grid: { 
      stroke: lineColor, 
      display: x => { 
      return x == 1 || x == data.length ? "none" : ""; 
      } 
     }, 
     ticks: { display: "none" }, 
     tickLabels: { display: "none" } 
     }} 
    /> 

    <VictoryLine 
     interpolation="monotoneX" 
     data={data} 
     style={{ 
     data: { stroke: "#fff", opacity: 1.0, strokeWidth: "5px" }, 
     labels: { fontSize: 12 }, 
     parent: { border: "1px solid #ccc" } 
     }} 
    /> 
    <VictoryLabel 
     x={30} 
     y={30} 
     style={{ 
     stroke: "#fff", 
     fill: "#fff", 
     fontSize: "25px", 
     fontFamily: "Roboto", 
     fontWeight: "bold" 
     }} 
     text={number} 
    /> 
    </VictoryChart> 

Dann kann ich ein Ergebnis wie diese:

Allerdings habe ich ein kleines Polster wirklich von der Linie hinzufügen müssen Diagramm nach oben/unten. Ich habe sowohl domainPadding und/oder padding selbst ausprobiert.

Was ist der richtige Weg, um Padding von der weißen Linie nach unten/oben hinzuzufügen? Die Achsenlinien müssen natürlich intakt bleiben.

Answer 1

Arbeiten durch Einstellen der domain Einstellung auf dem VictoryAxis selbst:

domain={{ x: [0.8, 5.2], y: [10000, 20000] }}