Latest source merged from Syncfusion
This commit is contained in:
pipeline
Родитель
e3995f4e46
Коммит
cb451a8f42
|
|
@ -15,6 +15,11 @@ The Syncfusion Flutter Barcode Generator is a data visualization widget used to
|
|||
|
||||
|
||||
|
||||
To get start quickly with our Flutter barcode generator widget, you can check on this video.
|
||||
|
||||
<style>#flutterChartVideoTutorial{width : 90% !important; height: 300px !important }</style>
|
||||
<iframe id='flutterChartVideoTutorial' src='https://www.youtube.com/embed/ckAHrT2CR8A'></iframe>
|
||||
|
||||
## Key Features
|
||||
|
||||
* **One-dimensional barcodes** - Barcode Generator supports different one-dimensional barcode symbologies such as [`Code128`](https://pub.dev/documentation/syncfusion_flutter_barcodes/latest/barcodes/Code128-class.html), [`EAN8`](https://pub.dev/documentation/syncfusion_flutter_barcodes/latest/barcodes/EAN8-class.html), [`EAN13`](https://pub.dev/documentation/syncfusion_flutter_barcodes/latest/barcodes/EAN13-class.html), [`UPC-A`](https://pub.dev/documentation/syncfusion_flutter_barcodes/latest/barcodes/UPCA-class.html), [`UPC-E`](https://pub.dev/documentation/syncfusion_flutter_barcodes/latest/barcodes/UPCE-class.html), [`Code39`](https://pub.dev/documentation/syncfusion_flutter_barcodes/latest/barcodes/Code39-class.html), [`Code39 Extended`](https://pub.dev/documentation/syncfusion_flutter_barcodes/latest/barcodes/Code39Extended-class.html), [`Code93`](https://pub.dev/documentation/syncfusion_flutter_barcodes/latest/barcodes/Code93-class.html), and [`Codabar`](https://pub.dev/documentation/syncfusion_flutter_barcodes/latest/barcodes/Codabar-class.html).
|
||||
|
|
|
|||
|
|
@ -1161,6 +1161,86 @@ In [`DateTimeAxis`](https://pub.dev/documentation/syncfusion_flutter_charts/late
|
|||
|
||||
{% endhighlight %}
|
||||
|
||||
## RangeController
|
||||
|
||||
The [`rangeController`](https://pub.dev/documentation/syncfusion_flutter_charts/latest/charts/ChartAxis/rangeController.html) property is used to set the maximum and minimum values for the chart in the viewport. In the minimum and maximum properties of the axis, you can specify the minimum and maximum values with respect to the entire data source. In the visibleMinimum and visibleMaximum properties, you can specify the values to be viewed in the viewed port i.e. range controller's start and end values respectively.
|
||||
|
||||
Here you need to specify the [`minimum`](https://pub.dev/documentation/syncfusion_flutter_charts/latest/charts/DateTimeAxis/minimum.html), [`maximum`](https://pub.dev/documentation/syncfusion_flutter_charts/latest/charts/DateTimeAxis/maximum.html), [`visibleMinimum`](https://pub.dev/documentation/syncfusion_flutter_charts/latest/charts/DateTimeAxis/visibleMinimum.html), and [`visibleMaximum`](https://pub.dev/documentation/syncfusion_flutter_charts/latest/charts/DateTimeAxis/visibleMaximum.html) properties to the axis and the axis values will be visible with respect to visibleMinimum and visibleMaximum properties.
|
||||
|
||||
{% highlight dart %}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
RangeController rangeController = RangeController(
|
||||
start: DateTime(2020, 2, 1),
|
||||
end: DateTime(2020, 2, 30),
|
||||
);
|
||||
SfCartesianChart sliderChart = SfCartesianChart(
|
||||
margin: const EdgeInsets.all(0),
|
||||
primaryXAxis:
|
||||
DateTimeAxis(isVisible: false),
|
||||
primaryYAxis: NumericAxis(isVisible: false),
|
||||
plotAreaBorderWidth: 0,
|
||||
series: <SplineAreaSeries<ChartSampleData, DateTime>>[
|
||||
SplineAreaSeries<ChartSampleData, DateTime>(
|
||||
// Add required properties.
|
||||
)
|
||||
],
|
||||
);
|
||||
return Scaffold(
|
||||
body: Column(
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: SfCartesianChart(
|
||||
primaryXAxis: DateTimeAxis(
|
||||
maximum: DateTime(2020, 1, 1),
|
||||
minimum: DateTime(2020, 3, 30),
|
||||
// set maximum value from the range controller
|
||||
visibleMaximum: rangeController.end,
|
||||
// set minimum value from the range controller
|
||||
visibleMinimum: rangeController.start,
|
||||
rangeController: rangeController),
|
||||
primaryYAxis: NumericAxis(),
|
||||
series: <SplineSeries<ChartSampleData, DateTime>>[
|
||||
SplineSeries<ChartSampleData, DateTime>(
|
||||
dataSource: splineSeriesData,
|
||||
xValueMapper: (ChartSampleData sales, _) =>
|
||||
sales.x as DateTime,
|
||||
yValueMapper: (ChartSampleData sales, _) => sales.y,
|
||||
// Add required properties.
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: SfRangeSelectorTheme(
|
||||
data: SfRangeSelectorThemeData(),
|
||||
child: SfRangeSelector(
|
||||
min: min,
|
||||
max: max,
|
||||
controller: rangeController,
|
||||
showTicks: true,
|
||||
showLabels: true,
|
||||
dragMode: SliderDragMode.both,
|
||||
onChanged: (SfRangeValues value) {
|
||||
// set the start value to rangeController from this callback
|
||||
rangeController.start = value.start;
|
||||
// set the end value to rangeController from this callback
|
||||
rangeController.end = value.end;
|
||||
setState(() {});
|
||||
},
|
||||
child: Container(
|
||||
child: sliderChart,
|
||||
),
|
||||
),
|
||||
)),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
{% endhighlight %}
|
||||
|
||||
## See Also
|
||||
|
||||
* [Rendering a particular part of a data using visible minimum and visible maximum in the Cartesian chart](https://www.syncfusion.com/kb/11308/how-to-render-particular-part-of-a-data-in-cartesian-charts-sfcartesianchart).
|
||||
|
|
|
|||
|
|
@ -13,10 +13,14 @@ Syncfusion Flutter Cartesian Charts (SfCartesianChart) widget is written nativel
|
|||
|
||||
|
||||
|
||||
To get start quickly with our Flutter chart widget, you can check on this video.
|
||||
|
||||
<style>#flutterChartVideoTutorial{width : 90% !important; height: 300px !important }</style>
|
||||
<iframe id='flutterChartVideoTutorial' src='https://www.youtube.com/embed/FwUSJtv-3NY'></iframe>
|
||||
|
||||
## Key Features
|
||||
|
||||
* **Chart types** - Supports more than 30+ different chart types such as [`line`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/line-chart), [`spline
|
||||
`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/spline-chart), [`column`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/column-chart), [`bar`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/bar-chart), [`area`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/area-chart), [`bubble`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/bubble-chart), [`box and whisker`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/box-and-whisker-chart), [`scatter`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/scatter-chart), [`step line`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/step-line-chart), [`fast line`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/line-chart), [`range column`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/range-column-chart), [`range area`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/range-area-chart), [`candle`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/candle-chart), [`hilo`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/hilo-chart), [`OHLC`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/ohlc-chart), [`histogram`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/histogram-chart), [`step area`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/step-area-chart), [`spline area`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/spline-area-chart), [`spline range area`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/spline-range-area-chart), [`stacked area`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/stacked-area-chart), [`stacked bar`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/stacked-bar-chart), [`stacked column`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/stacked-column-chart), [`stacked line`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/stacked-line-chart), [`100% stacked area`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/stacked-area-100-chart), [`100% stacked bar`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/stacked-bar-100-chart), [`100% stacked column`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/stacked-column-100-chart), [`100% stacked line`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/stacked-line-100-chart), [`waterfall`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/waterfall-chart), [`pie`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/pie-chart), [`doughnut`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/doughnut-chart), [`radial bar`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/radial-bar-chart), [`pyramid`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/pyramid-chart), [`funnel`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/funnel-chart). Each type represents data in a unique style. It is more user friendly and has greater UI visualization.
|
||||
* **Chart types** - Supports more than 30+ different chart types such as [`line`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/line-chart), [`spline`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/spline-chart), [`column`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/column-chart), [`bar`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/bar-chart), [`area`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/area-chart), [`bubble`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/bubble-chart), [`box and whisker`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/box-and-whisker-chart), [`scatter`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/scatter-chart), [`step line`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/step-line-chart), [`fast line`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/line-chart), [`range column`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/range-column-chart), [`range area`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/range-area-chart), [`candle`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/candle-chart), [`hilo`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/hilo-chart), [`OHLC`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/ohlc-chart), [`histogram`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/histogram-chart), [`step area`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/step-area-chart), [`spline area`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/spline-area-chart), [`spline range area`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/spline-range-area-chart), [`stacked area`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/stacked-area-chart), [`stacked bar`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/stacked-bar-chart), [`stacked column`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/stacked-column-chart), [`stacked line`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/stacked-line-chart), [`100% stacked area`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/stacked-area-100-chart), [`100% stacked bar`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/stacked-bar-100-chart), [`100% stacked column`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/stacked-column-100-chart), [`100% stacked line`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/stacked-line-100-chart), [`waterfall`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/waterfall-chart), [`pie`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/pie-chart), [`doughnut`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/doughnut-chart), [`radial bar`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/radial-bar-chart), [`pyramid`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/pyramid-chart), [`funnel`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/funnel-chart). Each type represents data in a unique style. It is more user friendly and has greater UI visualization.
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -13,6 +13,11 @@ Syncfusion Flutter Circular Charts (SfCircularChart) widget is written natively
|
|||
|
||||
|
||||
|
||||
To get start quickly with our Flutter circular chart widget, you can check on this video.
|
||||
|
||||
<style>#flutterChartVideoTutorial{width : 90% !important; height: 300px !important }</style>
|
||||
<iframe id='flutterChartVideoTutorial' src='https://www.youtube.com/embed/FwUSJtv-3NY'></iframe>
|
||||
|
||||
## Key Features
|
||||
|
||||
* **Chart types** - Supports 3 different series types such as [`pie`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/pie-chart), [`doughnut`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/doughnut-chart), and [`radial bar`](https://www.syncfusion.com/flutter-widgets/flutter-charts/chart-types/radial-bar-chart) series. Each type represents data in a unique style. It is more user friendly and has greater UI visualization.
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче