Reputation: 27
I want to create a line chart with a list of CoinData with SfCartesian Chart in flutter and I want the chart to automatically make the starting point of the y-axis the lowest number provided and the highest number to be the highest number provided. I looked through the docs https://help.syncfusion.com/flutter/cartesian-charts/axis-customization , and the closest thing I could find was the property anchorRangeToVisiblePoints: false
or manually setting the property visibleMinimum
and visibleMaximum
but that isn't an option as I would be passing different CoinData prices based on different coins and I can't use the same value for all of them, any idea how I can implement this
For more context, this is the code I am using to test and experiment.
import 'package:flutter/material.dart';
import 'package:syncfusion_flutter_charts/charts.dart';
class Charts extends StatefulWidget {
const Charts({Key? key}) : super(key: key);
@override
_ChartsState createState() => _ChartsState();
}
class _ChartsState extends State<Charts> {
@override
void initState() {
// TODO: implement initState
// _CoinData = getChartData();
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Container(
height: 267,
child: SfCartesianChart(
primaryYAxis: NumericAxis(isVisible: false,anchorRangeToVisiblePoints: false,),
tooltipBehavior: TooltipBehavior(enable: false),
primaryXAxis: DateTimeAxis(isVisible: false,),
series: <ChartSeries>[
// Renders line chart
LineSeries<CoinData, DateTime>(
dataSource: prices,
xValueMapper: (CoinData sales, _) => sales.year,
yValueMapper: (CoinData sales, _) => sales.sales)
]))));
}
}
class CoinData {
CoinData(int year, this.sales) {
this.year = DateTime.fromMillisecondsSinceEpoch(year).toLocal();
}
late DateTime year;
double sales;
}
List<CoinData> prices = [
CoinData(1642392036421, 42749.711818578595),
CoinData(1642388517068, 42989.70122789917),
CoinData(1642395633127, 42712.08236994989),
CoinData(1642402838825, 42843.846816992016),
CoinData(1642399332413, 42599.83212961661),
CoinData(1642406434920, 42718.431064867356),
CoinData(1642410277789, 42918.18830305879),
CoinData(1642413740231, 42953.704362756995),
CoinData(1642417237341, 42848.42337504775),
CoinData(1642420853261, 42787.2565709712),
CoinData(1642424533130, 42666.07903883221),
CoinData(1642428022319, 42682.25091040553),
CoinData(1642431666253, 42706.84109519157),
CoinData(1642435475100, 42554.380859461504),
CoinData(1642438853722, 42288.63596857892),
CoinData(1642442594070, 42117.89357566385),
CoinData(1642446293756, 42292.17977430048),
CoinData(1642449728774, 42331.65604621167),
CoinData(1642453270106, 42213.655228582276),
CoinData(1642456918900, 41756.89208374346),
CoinData(1642460477923, 42346.541012394795),
CoinData(1642464161403, 42311.13096812778),
CoinData(1642468369285, 42420.84387886949),
CoinData(1642471295036, 42305.94587540152),
CoinData(1642474865285, 42310.62962338389),
CoinData(1642478466863, 42073.464694362105),
CoinData(1642482191362, 42104.48450429597),
CoinData(1642485765736, 42243.993380507665),
CoinData(1642489204082, 42415.20222337461),
CoinData(1642492943052, 42085.76408393512),
CoinData(1642496567754, 41774.58393396233),
CoinData(1642500099392, 42055.251604425226),
CoinData(1642503653184, 42058.93212053518),
CoinData(1642507342334, 41843.44735603253),
CoinData(1642510959133, 41889.82064061213),
CoinData(1642514481569, 41727.002021779736),
CoinData(1642518077038, 41356.61112815827),
CoinData(1642521723376, 41702.56259168864),
CoinData(1642525337159, 41796.53046970178),
CoinData(1642528983594, 41550.28411391625),
CoinData(1642532466377, 41716.19509209493),
CoinData(1642536297311, 41812.879241771945),
CoinData(1642539721904, 41741.91803252099),
CoinData(1642543231985, 42498.18123135277),
CoinData(1642546837453, 42498.47853946216),
CoinData(1642550473450, 42395.45879157343),
CoinData(1642554229144, 42332.290976869364),
CoinData(1642557774831, 42454.98929665433),
CoinData(1642561329780, 42334.4404296046),
CoinData(1642564980424, 41779.01270893919),
CoinData(1642568497700, 41820.97346316072),
CoinData(1642572157122, 41778.45401628946),
CoinData(1642575888262, 41781.40839917395),
CoinData(1642579246250, 41265.005495175465),
CoinData(1642582988822, 41325.06579035713),
CoinData(1642586541303, 41658.36261134919),
CoinData(1642590063989, 41455.42789267524),
CoinData(1642593802287, 42111.015879629755),
CoinData(1642597245462, 42194.35952948134),
CoinData(1642600921347, 42201.65536625609),
CoinData(1642604564168, 42652.55815588597),
CoinData(1642608225687, 42014.03261432062),
CoinData(1642611838743, 41969.260501867146),
CoinData(1642615253442, 42134.455770558474),
CoinData(1642619019192, 42025.43482944683),
CoinData(1642622544973, 41968.95038082978),
CoinData(1642626078457, 41618.25322218039),
CoinData(1642629658614, 41817.745577805385),
CoinData(1642633358721, 42035.87953978328),
CoinData(1642636805471, 41749.55143098559),
CoinData(1642641169518, 41907.06638025352),
CoinData(1642644119959, 41813.24412079334),
CoinData(1642647699541, 42072.19957608677),
CoinData(1642651295109, 41995.408525918814),
CoinData(1642654929816, 41969.901994013315),
CoinData(1642658514025, 41923.96890233066),
CoinData(1642662252361, 42064.208021444596),
CoinData(1642665773630, 42113.0463479793),
CoinData(1642669406880, 41964.771542199494),
CoinData(1642672807732, 42153.83194877708),
CoinData(1642676524869, 42155.166974090964),
CoinData(1642680057034, 42210.41697932467),
CoinData(1642683741769, 42078.59816595068),
CoinData(1642687252649, 42457.09178193016),
CoinData(1642690904488, 43120.58908265619),
CoinData(1642694609592, 43308.03956681778),
CoinData(1642698105291, 43299.353057524866),
CoinData(1642701608567, 43056.540669581744),
CoinData(1642705247727, 43149.926635185744),
CoinData(1642708911675, 42946.95943008196),
CoinData(1642712563338, 42612.93819242102),
CoinData(1642716114837, 41368.03820513283),
CoinData(1642719655169, 41244.72558790132),
CoinData(1642723259219, 40707.6824143097),
CoinData(1642726814802, 41011.486226241585),
CoinData(1642730438307, 39502.20976924315),
CoinData(1642734045516, 40005.428327993286),
CoinData(1642737632525, 38595.357998473075),
CoinData(1642741374260, 38972.1426142197),
CoinData(1642744931144, 39069.60851847918),
CoinData(1642748534002, 38825.08225149761),
CoinData(1642752138990, 39285.10057661805),
CoinData(1642755972492, 39282.13205482304),
CoinData(1642759231219, 39146.98486305409),
CoinData(1642762897123, 39029.01940763461),
CoinData(1642766505275, 38972.112801224925),
CoinData(1642770171389, 37978.94600196123),
CoinData(1642773639856, 38683.65020437281),
CoinData(1642777278422, 38477.708224151065),
CoinData(1642780809533, 39161.402329147226),
CoinData(1642784572974, 38684.34956161961),
CoinData(1642788115113, 38357.71969772329),
CoinData(1642791689302, 38555.043969645936),
CoinData(1642795342047, 38203.1890035537),
CoinData(1642798814773, 38178.00057195512),
CoinData(1642802402972, 36018.680208090766),
CoinData(1642806110522, 35761.710943672675),
CoinData(1642809848015, 36385.341362730935),
CoinData(1642814471774, 36342.22689553229),
CoinData(1642816873862, 36637.351584595846),
CoinData(1642820548357, 36639.176855482365),
CoinData(1642824152214, 36317.547348304455),
CoinData(1642827750453, 36412.4702263163),
CoinData(1642831381738, 35732.43347988268),
CoinData(1642834948400, 35869.70749858731),
CoinData(1642838429026, 35580.66865547844),
CoinData(1642842379605, 35692.12145599295),
CoinData(1642845602154, 34658.69118169887),
CoinData(1642849332824, 35631.29321200412),
CoinData(1642852860526, 35423.733623564774),
CoinData(1642856436347, 35952.32534384478),
CoinData(1642860031930, 35680.11740179815),
CoinData(1642863977964, 35193.74160008464),
CoinData(1642867200863, 34991.02054654133),
CoinData(1642870885598, 35109.6564826399),
CoinData(1642874429377, 34631.73103161949),
CoinData(1642878479406, 34527.6528378289),
CoinData(1642881707361, 34602.79496883843),
CoinData(1642885302767, 35464.161836675376),
CoinData(1642888839111, 35630.207411484356),
CoinData(1642892552509, 34935.31059784646),
CoinData(1642896166621, 35180.435462830384),
CoinData(1642899604966, 35432.61134395314),
CoinData(1642903362311, 35448.608106994194),
CoinData(1642906830933, 35044.59262923074),
CoinData(1642910508104, 35176.65728559375),
CoinData(1642914151050, 35348.42857530886),
CoinData(1642917659189, 35591.25705774395),
CoinData(1642921325713, 35342.902225939535),
CoinData(1642924951086, 35673.892148853825),
CoinData(1642928575653, 35760.80532005177),
CoinData(1642932210452, 35974.488705639684),
CoinData(1642935648639, 35898.49265417996),
CoinData(1642939382142, 35764.30539081825),
CoinData(1642942855334, 35924.69475847814),
CoinData(1642946608245, 36066.53867510662),
CoinData(1642950193192, 35208.08509273927),
CoinData(1642954326416, 35476.641272607),
CoinData(1642957238487, 35363.39608281859),
CoinData(1642960836652, 35472.73143627676),
CoinData(1642964487734, 35005.57945651765),
CoinData(1642968200712, 34804.560652713786),
CoinData(1642971750755, 35332.049887473404),
CoinData(1642975229876, 35566.67303014184),
CoinData(1642978900086, 35578.38113726986),
CoinData(1642982449012, 36306.409440464704),
CoinData(1642986538625, 35976.423803204576),
CoinData(1642989785208, 35614.40208623434),
CoinData(1642991427000, 35631.47620568353)
];
For more context, this is what I'm trying to create
I do not want it to start from 0, I want it to start from the lowest number like 31,000 or something but I don't want to manually use the property visibleMinimum
and visibleMaximum
to set the range, as it would be using different coins with different values.
Upvotes: 1
Views: 3688
Reputation: 551
Your requirement can be achieved using the rangePadding property available in the axis. Set the range padding as round, this will round off the range for the available data point. We have provided the UG and code snippet below for your reference.
Code snippet:
primaryYAxis: NumericAxis(
rangePadding: ChartRangePadding.round
)
UG: https://help.syncfusion.com/flutter/cartesian-charts/axis-types#applying-padding-to-the-range
Upvotes: 5