Grouped Stacked chart not grouping

[sahatsawat-s]

the Grouped Stacked is not grouping when i take code from website

series: [
{
name: 'Q1 Budget',
group: 'budget',
data: [44000, 55000, 41000, 67000, 22000]
},
{
name: 'Q1 Actual',
group: 'actual',
data: [48000, 50000, 40000, 65000, 25000]
},
{
name: 'Q2 Budget',
group: 'budget',
data: [13000, 36000, 20000, 8000, 13000]
},
{
name: 'Q2 Actual',
group: 'actual',
data: [20000, 40000, 25000, 10000, 12000]
}
],
chartOptions: {
chart: {
type: 'bar',
height: 350,
stacked: true,
},
stroke: {
width: 1,
colors: ['#fff']
},
dataLabels: {
formatter: (val) => {
return val / 1000 + 'K'
}
},
plotOptions: {
bar: {
horizontal: false,
borderRadius: 10,
dataLabels: {
total: {
enabled: true,
style: {
fontSize: '13px',
fontWeight: 900
}
}
}
},
},
xaxis: {
categories: [
'Online advertising',
'Sales Training',
'Print advertising',
'Catalogs',
'Meetings'
],
labels: {
formatter: (val) => {
return val / 1000 + 'K'
}
}
},
fill: {
opacity: 1,
},
colors: ['#80c7fd', '#008FFB', '#80f1cb', '#00E396'],
legend: {
position: 'top',
horizontalAlign: 'left'
}
},

      ` <apexchart type="bar" height="100%" :options="chartOptions" :series="series"></apexchart>`

[riksnelders]

Same issue here. Any update on this?

[MikeCLX]

Same here also, does anyone have any ideas?

[MaksSieve]

Hi guys, still no solution or workaorund?

[junedchhipa]

Which version of apexcharts are you using? Please upgrade to the latest version and try again.

[MaksSieve]

@junedchhipa
latest version of apexcharts causes this error:

Module parse failed: Unexpected token (6:41650)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
|  * Released under the MIT License.
|  */
> ...
|   * @svgdotjs/svg.select.js - An extension of svg.js which allows to select elements with mouse

cannot show this string because it's a JS module compileid in one-string, GH forbid to send more than 65k symbols

tried [email protected], 4.0.0
3.54.1 runs, but grouping still does not work

UPDATE:
I think I found root of this error, I assume its because I use Node.js v.16.
What least version of apexcharts I need for grouping works?

UPDATE 2:
I 've found that this feature was introduced in [email protected], so why its not working in [email protected]+ [email protected]?

[MaksSieve]

Finally) the problem was the 'name' field should be unique per series and it's not mentioned in docs.

@junedchhipa Another question: is there any option to show group names?