Reputation: 359
I have a simple graph in which I have x-axis as string and y-axis as int but my values are too long 10000 I need to show it as 10k
My code
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)
]),
),
In the image you can see it's showing 36000 I need to show it as 36k I try to convert it to k value but the issue is on yValueMapper it's showing string isn't allowed. So what I was thinking is maybe there is some value to show mapper? like graph will work on value mapper and text will be different.
Upvotes: 1
Views: 2633
Reputation: 1227
The above answer is correct but you need to format the primary axis
Like this
primaryYAxis: NumericAxis(
numberFormat: NumberFormat.compact(),
)
Upvotes: 5
Reputation: 3074
You can use the NumberFormat
class from intl
package
Like so:
import 'package:intl/intl.dart';
void main() {
final number = NumberFormat.compact().format(10000);
print(number); // 10k
}
Upvotes: 0