为了显示带有长标签元素的条形图,我曾经完全垂直显示它,但单词被这样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}
/>