Column Chart Grouped and Stacked
Closed this issue · 1 comments
saifidrees commented
Loahrs commented
I created a PR to add another constructor and added a field for property "group".
This makes it possible to create something like this: https://apexcharts.com/javascript-chart-demos/column-charts/grouped-stacked-columns/
ApexCharts chart = ApexChartsBuilder.get()
.withSeries(new Series<>("Q1 Budget","budget", 44000, 55000, 41000, 67000, 22000, 43000),
new Series<>("Q1 Actual","actual", 48000, 50000, 40000, 65000, 25000, 40000),
new Series<>("Q2 Budget","budget", 13000, 36000, 20000, 8000, 13000, 27000),
new Series<>("Q2 Actual","actual", 20000, 40000, 25000, 10000, 12000, 28000)
)
.withChart(ChartBuilder.get()
.withType(Type.BAR)
.withStacked(true)
.withHeight("350")
.build())
.withStroke(StrokeBuilder.get()
.withColors("#fff")
.withWidth(1.0)
.build())
.withDataLabels(DataLabelsBuilder.get()
.withFormatter("""
(val) => {
return val / 1000 + "K"
}
""")
.build())
.withPlotOptions(PlotOptionsBuilder.get()
.withBar(BarBuilder.get()
.withHorizontal(false)
.build())
.build())
.withXaxis(XAxisBuilder.get().withCategories(
"Online advertising",
"Sales Training",
"Print advertising",
"Catalogs",
"Meetings",
"Public relations").build())
.withFill(FillBuilder.get()
.withOpacity(1.0).build())
.withColors("#80c7fd", "#008FFB", "#80f1cb", "#00E396")
.withYaxis(YAxisBuilder.get()
.withLabels(LabelsBuilder.get()
.withFormatter("""
(val) => { return (val / 1000) + "K" }
""")
.build())
.build())
.withLegend(LegendBuilder.get()
.withPosition(Position.TOP)
.withHorizontalAlign(HorizontalAlign.LEFT)
.build())
.build();