Flutter 将 y 轴值显示为字符串
Flutter show y axis values as string
我有一个简单的图表,其中 x 轴为字符串,y 轴为 int,但我的值太长 10000 我需要将其显示为 10k
我的代码
Container(
height: MediaQuery.of(context).size.height * 0.25,
child: SfCartesianChart(
enableAxisAnimation: true,
primaryXAxis: CategoryAxis(
majorGridLines: MajorGridLines(width: 0),
//Hide the axis line of x-axis
axisLine: AxisLine(width: 0),
interval: 1),
primaryYAxis: NumericAxis(
minimum: 0, maximum: highSale,
interval: highSale < 200 ? 100 : 2000,
majorGridLines: MajorGridLines(width: 0),
//Hide the axis line of x-axis
axisLine: AxisLine(width: 0),
),
tooltipBehavior: _tooltip,
plotAreaBorderWidth: 0,
legend: Legend(isVisible: false),
series: <ChartSeries<_ChartData, String>>[
ColumnSeries<_ChartData, String>(
dataSource: weekly
? data
: yearly
? dataMonth
: monthly
? dataDaily
: daily
? dataDaily
: [],
xValueMapper: (_ChartData data, _) => data.x,
yValueMapper: (_ChartData data, _) => data.y,
pointColorMapper: (_ChartData data, _) => data.color,
name: 'Week',
color: weekly ? kPrimaryColor : Colors.red)
]),
),
在图像中您可以看到它显示 36000 我需要将其显示为 36k 我尝试将其转换为 k 值但问题出在 yValueMapper 上,它不允许显示字符串。所以我在想也许展示映射器有一些价值? like graph 将在值映射器上工作,文本会有所不同。
您可以使用 intl
包中的 NumberFormat
class
像这样:
import 'package:intl/intl.dart';
void main() {
final number = NumberFormat.compact().format(10000);
print(number); // 10k
}
以上答案正确,但需要格式化主轴
像这样
primaryYAxis: NumericAxis(
numberFormat: NumberFormat.compact(),
)
我有一个简单的图表,其中 x 轴为字符串,y 轴为 int,但我的值太长 10000 我需要将其显示为 10k
我的代码
Container(
height: MediaQuery.of(context).size.height * 0.25,
child: SfCartesianChart(
enableAxisAnimation: true,
primaryXAxis: CategoryAxis(
majorGridLines: MajorGridLines(width: 0),
//Hide the axis line of x-axis
axisLine: AxisLine(width: 0),
interval: 1),
primaryYAxis: NumericAxis(
minimum: 0, maximum: highSale,
interval: highSale < 200 ? 100 : 2000,
majorGridLines: MajorGridLines(width: 0),
//Hide the axis line of x-axis
axisLine: AxisLine(width: 0),
),
tooltipBehavior: _tooltip,
plotAreaBorderWidth: 0,
legend: Legend(isVisible: false),
series: <ChartSeries<_ChartData, String>>[
ColumnSeries<_ChartData, String>(
dataSource: weekly
? data
: yearly
? dataMonth
: monthly
? dataDaily
: daily
? dataDaily
: [],
xValueMapper: (_ChartData data, _) => data.x,
yValueMapper: (_ChartData data, _) => data.y,
pointColorMapper: (_ChartData data, _) => data.color,
name: 'Week',
color: weekly ? kPrimaryColor : Colors.red)
]),
),
在图像中您可以看到它显示 36000 我需要将其显示为 36k 我尝试将其转换为 k 值但问题出在 yValueMapper 上,它不允许显示字符串。所以我在想也许展示映射器有一些价值? like graph 将在值映射器上工作,文本会有所不同。
您可以使用 intl
包中的 NumberFormat
class
像这样:
import 'package:intl/intl.dart';
void main() {
final number = NumberFormat.compact().format(10000);
print(number); // 10k
}
以上答案正确,但需要格式化主轴
像这样
primaryYAxis: NumericAxis(
numberFormat: NumberFormat.compact(),
)