0

为了显示带有长标签元素的条形图,我曾经完全垂直显示它,但单词被这样verticalLabelRotation={90}切断了。图表的高度定义为好像我将其更改为仅显示完整的文本但图表太大,所以这不是我想要的,我想要一个调整大小的图表来显示标签的整个文本?height = {screen Width / 1.75]screenWidth

这是图表配置:

const chartConfig = {
backgroundGradientFrom: "#fff",
backgroundGradientTo: "#fff",
barPercentage: 0.7,
fillShadowGradient: "#31b189",
fillShadowGradientOpacity: 1,
decimalPlaces: 0, // optional, defaults to 2dp
color: (opacity = 1) => `#31b189`,
labelColor: (opacity = 1) => `rgba(0, 0, 0, 1)`,

style: {
  borderRadius: 16,
  fontFamily: "Bogle-Regular",
},
propsForBackgroundLines: {
  strokeWidth: 1,
  stroke: "#e3e3e3",
  strokeDasharray: "0",
},
propsForLabels: {
  fontFamily: "Bogle-Regular",
},

},

和 barChart 组件:

<BarChart
        style={{ flex: 1, paddingRight: 22 }}
        data={data}
        fromZero="true"
        showValuesOnTopOfBars="true"
        width={screenWidth / 1.07}
        height={screenWidth}
        chartConfig={chartConfig}
        verticalLabelRotation={90}
      />
4

0 回答 0