@@ -13,55 +13,54 @@ A Chart.js 4+ Wrapper for Vaadin
1313## Usage
1414
15151 . Define a custom chart or use the `` showChart `` -method directly.<br />Example:
16- ``` java
17- public class ExampleChartContainer extends ChartContainer
18- {
19- public void show (Data data )
16+ ``` java
17+ public class ExampleChartContainer extends ChartContainer
2018 {
21- BarData data = ... ; // Build the bar chart data from the handed over data
22- this . showChart(new BarChart (data)
23- .setOptions(new BarOptions ()
24- .setResponsive(true )
25- .setMaintainAspectRatio(false )
26- .setPlugins(new Plugins ()
27- .setTitle(new Title ()
28- .setText(" Age" )
29- .setDisplay(true ))))
30- .toJson());
19+ public void show (Data data )
20+ {
21+ BarData data = ... ; // Build the bar chart data from the handed over data
22+ this . showChart(new BarChart (data)
23+ .setOptions(new BarOptions ()
24+ .setResponsive(true )
25+ .setMaintainAspectRatio(false )
26+ .setPlugins(new Plugins ()
27+ .setTitle(new Title ()
28+ .setText(" Age" )
29+ .setDisplay(true ))))
30+ .toJson());
31+ }
3132 }
32- }
33- ```
34-
33+ ```
35342. Add the chart to your view/ component:
36- ``` java
37- public class ExampleView extends VerticalLayout
38- {
39- private final ExampleChartContainer chart = new ExampleChartContainer ();
40-
41- public ExampleView ()
42- {
43- this . add(this . chart);
44- // ...
45- }
46-
47- private void loadDataAndShowChart ()
35+ ```java
36+ public class ExampleView extends VerticalLayout
4837 {
49- this . chart. showLoading ();
38+ private final ExampleChartContainer chart = new ExampleChartContainer ();
5039
51- UI ui = UI . getCurrent();
52- CompletableFuture . runAsync(() - > {
53- try {
54- var data = ... ; // Load some data from the backend
55- // You may also convert the data here and call showChart
56- ui. access(() - > this . chart. show(data));
57- } catch (Exception ex) {
58- // Display the error message when loading fails
59- ui. access(() - > this . chart. showFailed(ex. getMessage()));
60- }
61- });
62- }
63- }
64- ```
40+ public ExampleView ()
41+ {
42+ this . add(this . chart);
43+ // ...
44+ }
45+
46+ private void loadDataAndShowChart ()
47+ {
48+ this . chart. showLoading();
49+
50+ UI ui = UI . getCurrent();
51+ CompletableFuture . runAsync(() - > {
52+ try {
53+ var data = ... ; // Load some data from the backend
54+ // You may also convert the data here and call showChart
55+ ui. access(() - > this . chart. show(data));
56+ } catch (Exception ex) {
57+ // Display the error message when loading fails
58+ ui. access(() - > this . chart. showFailed(ex. getMessage()));
59+ }
60+ });
61+ }
62+ }
63+ ```
6564
6665For more usage examples please have a look at [the demo](. / vaadin- chartjs- wrapper- demo/ src/ main/ java/ software/ xdev/ vaadin/ chartjs/ demo/ ).
6766
0 commit comments