react-native-chart-kit barchart 图形切割

问题描述

我是 react-native-chart-kit for barchar 我想在图表中显示按月计算的数据,但是当我在图表中设置数据时,它正在切割。看我分享图片代码

const data = {
  labels: [
    'Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec',],datasets: [
    {
      data: [
        Math.random() * 100,Math.random() * 100,color: (opacity = 1) => `rgba(192,112,47,${opacity})`,},};

<BarChart
              width={width}
              height={height}
              data={data}
              yLabelsOffset={25}

              chartConfig={{
                backgroundColor: colors.blank,backgroundGradientFrom: colors.blank,backgroundGradientTo: colors.blank,color: (opacity = 1) => `rgba(255,255,decimalPlaces: 0,style: {
                  fontFamily: env.fontRegular,propsForLabels: {
                  fontFamily: env.fontRegular
                },}}
              style={{
                marginVertical: 8,borderRadius: 16,}}
            />

enter image description here

解决方法

对此的一种可能解决方案是在 barPercentage 上将 chartConfig 设置为小于 1 的值。这将使条形变小,同时仍将它们散布在可用空间中。

    <BarChart
      width={windowWidth}
      height={300}
      data={data}
      yLabelsOffset={25}
      chartConfig={{
        color: (opacity = 1) => `rgba(255,255,${opacity})`,decimalPlaces: 0,style: {},propsForLabels: {},barPercentage: .3
      }}
      style={{
        marginVertical: 8,borderRadius: 16,}}
    />