chart_flutter标签/ x轴上的文本彼此重叠 [英] charts_flutter labels/text on x-axis overlapping each other
本文介绍了chart_flutter标签/ x轴上的文本彼此重叠的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我在flutter中使用Charts_flutter包绘制了条形图。但是x轴上的域标签彼此重叠。有什么办法可以解决这个问题?有没有办法使文本倾斜或增加图表的宽度,使它可以水平滚动?
I rendered bar chart using the charts_flutter package in flutter. But the domain label on x-axis overlap each other. Is there a way I can resolve this? Is there a way to either incline the text or increase the width of the chart so that it becomes horizontally scrollable?
我尝试搜索任何解决方案,例如labelspecs,但无法找到解决方案。这是我的代码-
I have tried searching for any solutions like labelspecs but could not reach a solution. Here's my code -
double maxheight = .80 * MediaQuery.of(context).size.height;
var series = [
new charts.Series(
domainFn: (BarChartConfig barchartconfig, _) => barchartconfig.name,
measureFn: (BarChartConfig barchartconfig, _) => barchartconfig.rowcount,
colorFn: (BarChartConfig barchartconfig, _) => barchartconfig.color,
id: 'Count',
data: datacharts,
)
];
var chart = new charts.BarChart(
series,
animate: true,
animationDuration: Duration(seconds: 2),
);
return SizedBox(
height: maxheight,
child: chart,
);
推荐答案
@ aswani-prakash答案很好,
@aswani-prakash answer is good,
如果您希望标签可见,则只需旋转x轴标签即可。
If you want your labels visible, Then you can simply rotate x-axis labels.
BarChart(
...
domainAxis: charts.OrdinalAxisSpec(
renderSpec: charts.SmallTickRendererSpec(labelRotation: 60),
),
),
这篇关于chart_flutter标签/ x轴上的文本彼此重叠的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文