react-native-charts-wrapper How to set xAxis width, margin or padding

how can i set config of xAxis to get the effect of expected. can u help me?? @wuxudong

Expected Behavior

Actual Behavior

Data and config

         yAxis={{
                left: { enabled: false },
                right: {
                  enabled: true,
                  drawAxisLine: false,
                  drawGridLines: true,
                  textColor: processColor(color.black_989898),
                  textSize: 12 * screen.pxDp,
                  gridColor: processColor(color.black_F2F2F2),
                  gridLineWidth: 1 * screen.pxDp,
                  labelCount: 4,
                  labelCountForce: true,
                  valueFormatter: "###0.00%",
                  ...(Platform.OS === "ios"
                    ? { spaceTop: 0.1, spaceBottom: 0.1 }
                    : {})
                }
              }}
              xAxis={{
                enabled: true,
                position: "BOTTOM",
                drawAxisLine: false,
                drawGridLines: false,
                labelCount: 3,
                labelCountForce: true,
                textColor: processColor(color.black_989898),
                textSize: 12 * screen.pxDp,
                valueFormatter: "date",
                granularityEnabled: true,
                granularity: 1,
                // centerAxisLabels: true,
                avoidFirstLastClipping: true,
                valueFormatterPattern: "YYYY-MM-dd",
                yOffset: 6 * screen.pxDp
              }}
              viewPortOffsets={
                Platform.OS === "ios"
                  ? {
                      top: 8 * screen.pxDp,
                      right: 54 * screen.pxDp,
                      bottom: 21 * screen.pxDp,
                      left: 0
                    }
                  : undefined
              }