apexcharts.common.js:6 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'group') #598

sai12-creator · 2024-04-25T16:10:02Z

hi everyone im getting very complex error actually in localhost react-apexchart working fine not giving any errors in console but coming to dev portal above error is throwing only in dev portal local is working fine
apexcharts.common.js:6 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'group')
at apexcharts.common.js:6:166282
at Array.forEach ()
at apexcharts.common.js:6:166243
at Array.forEach ()
at t.value (apexcharts.common.js:6:166209)
at t.value (apexcharts.common.js:6:172254)
at t.value (apexcharts.common.js:6:168242)
at t.value (apexcharts.common.js:6:417928)
at t.value (apexcharts.common.js:14:37913)
at t.create (apexcharts.common.js:6:4486)

RodolfoRdz11 · 2024-05-28T17:34:57Z

If you are using react, it was fixed in react-apexcharts@1.4.1

madebywitteveen · 2024-06-09T17:41:00Z

I have something similar with another property 'map':

apexcharts-card: Error: Cannot read properties of undefined (reading 'map')
at eval (eval at _generateData (apexcharts-card.js?hacstag=331701152204:835:42497), :3:46)
at Ia._generateData (apexcharts-card.js?hacstag=331701152204:835:42598)
at Ia._updateHistory (apexcharts-card.js?hacstag=331701152204:835:38894)
at apexcharts-card.js?hacstag=331701152204:908:3531
at Array.map ()
at tr._updateData (apexcharts-card.js?hacstag=331701152204:908:3486)
at tr._firstDataLoad (apexcharts-card.js?hacstag=331701152204:835:77071)
at tr._initialLoad (apexcharts-card.js?hacstag=331701152204:908:3176)

How can I fix this ?

thank, you

DevelopJKong · 2024-06-25T04:00:24Z

It seems like this issue is still problematic. How can it be resolved?

seniordev-ca · 2024-06-27T08:55:28Z

I am also getting the same error, in my case I am getting above error on the local as well.
Any updates here?

sai12-creator · 2024-06-27T09:05:36Z

Dondrage to earlier version

seniordev-ca · 2024-06-27T09:08:26Z

If you are using react, it was fixed in react-apexcharts@1.4.1

@RodolfoRdz11 I am on react-apexcharts@1.4.1, but still have the same error.

seniordev-ca · 2024-06-27T09:09:38Z

Dondrage to earlier version

@sai12-creator , which version are you on? I am on the latest react-apexcharts@1.4.1 and I am still getting this error.
I also tried to use group property to use synchronized charts, but it never works.

sai12-creator · 2024-06-27T09:15:22Z

3.48

RodolfoRdz11 · 2024-06-27T21:51:10Z

I'm using React, with the library react-apexcharts.
I found a nonsense fix, I have an object defaultChartOptions with all default options, obviuosly. Then I have a useEffect that sets the data in xaxis and yaxis, so I used spread operator to set data like this:

` useEffect(() => {
if (!_.isEmpty(areaChartData.graph_data)) {
const oppositeMax = getMax([
...areaChartData.graph_data.series?.[1]?.data,
...areaChartData.graph_data.series?.[2]?.data
], true)

		const oppositeMin = getMin([
			...areaChartData.graph_data.series?.[1]?.data,
			...areaChartData.graph_data.series?.[2]?.data
		])

		setOptions({
			...options,
			series: areaChartData.graph_data.series.map((serie: any) => ({
				...serie,
				data: serie.data.map((value: number) => value.toFixed(2))
			})),
			xaxis: {
				...options.xaxis,
				categories: areaChartData.graph_data.categories.map((category: string) => parseInt(category))
			},
			yaxis: [{
				...options?.yaxis?.[0],
				min: getMin(areaChartData.graph_data.series?.[0]?.data),
				max: getMax(areaChartData.graph_data.series?.[0]?.data),
			}, {
				...options?.yaxis?.[1],
				min: oppositeMin,
				max: oppositeMax,
			}, {
				...options?.yaxis?.[2],
				min: oppositeMin,
				max: oppositeMax,
			}]
		})
	}
}, [areaChartData])`

The bug was caused by the yaxis attribute (I tried removing every attribute to find out what was causing the error), then I tried set the yaxis directly without spread operator and the error no longer appeared

` useEffect(() => {
if (!_.isEmpty(areaChartData.graph_data)) {
const oppositeMax = getMax([
...areaChartData.graph_data.series?.[1]?.data,
...areaChartData.graph_data.series?.[2]?.data
], true)

		const oppositeMin = getMin([
			...areaChartData.graph_data.series?.[1]?.data,
			...areaChartData.graph_data.series?.[2]?.data
		])

		setOptions({
			...options,
			series: areaChartData.graph_data.series.map((serie: any) => ({
				...serie,
				data: serie.data.map((value: number) => value.toFixed(2))
			})),
			xaxis: {
				...options.xaxis,
				categories: areaChartData.graph_data.categories.map((category: string) => parseInt(category))
			},
			yaxis: [{
				title: {
					text: 'Monto',
					offsetY: -150,
					offsetX: 35,
					rotate: 360,
					style: {
						fontFamily: fontFamilies,
						fontWeight: 500,
						color: '#8892A0',
						fontSize: '12px'
					}
				},
				show: true,
				labels: {
					formatter: (val: number, opts?: any) => nFormatter(val, 1),
					offsetX: -45,
					style: {
						fontFamily: fontFamilies,
						fontWeight: 600,
						fontSize: '14px',
						colors: '#242C37'
					}
				},
				min: getMin(areaChartData.graph_data.series?.[0]?.data),
				max: getMax(areaChartData.graph_data.series?.[0]?.data),
			}, {
				opposite: true,
				title: {
					text: '',
					offsetY: 0,
					offsetX: 0,
					style: {
						fontFamily: fontFamilies,
						fontWeight: 500,
						color: '#8892A0',
						fontSize: '12px'
					}
				},

				show: true,
				labels: {
					formatter: (val: number, opts?: any) => nFormatter(val, 1),
					offsetX: -15,
					style: {
						fontFamily: fontFamilies,
						fontWeight: 600,
						fontSize: '14px',
						colors: '#242C37'
					}
				},
				min: oppositeMin,
				max: oppositeMax,
			}, {
				opposite: true,
				show: false,
				min: oppositeMin,
				max: oppositeMax,
			}]
		})
	}
}, [areaChartData])`

jutdinh · 2024-07-21T13:39:18Z

any solutions?

madebywitteveen · 2024-07-21T13:41:19Z

The error on my side was with the nordpool integration but have no time yet to investigate thanks From: Huynh Ngoc Dinh ***@***.***> Sent: zondag 21 juli 2024 15:40 To: apexcharts/react-apexcharts ***@***.***> Cc: madebywitteveen ***@***.***>; Comment ***@***.***> Subject: Re: [apexcharts/react-apexcharts] apexcharts.common.js:6 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'group') (Issue #598) any solutions? — Reply to this email directly, view it on GitHub <#598 (comment)> , or unsubscribe <https://github.com/notifications/unsubscribe-auth/APEZVYVMIMIBU46JBK44VHDZNO2ZZAVCNFSM6AAAAABGZGFXXWVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDENBRGYYTKMJUGY> . You are receiving this because you commented. <https://github.com/notifications/beacon/APEZVYQDQDJNXOA3EE4D3BLZNO2ZZA5CNFSM6AAAAABGZGFXXWWGG33NNVSW45C7OR4XAZNMJFZXG5LFINXW23LFNZ2KUY3PNVWWK3TUL5UWJTUFTRKSU.gif> Message ID: ***@***.*** ***@***.***> >

pedroeckel · 2024-08-01T15:18:56Z

The same error here. Any solution?

madebywitteveen · 2024-08-01T17:35:12Z

Nope, no solution yet. Thanks

…

________________________________ From: Pedro Eckel ***@***.***> Sent: Thursday, August 1, 2024 17:19 To: apexcharts/react-apexcharts Cc: madebywitteveen; Comment Subject: Re: [apexcharts/react-apexcharts] apexcharts.common.js:6 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'group') (Issue #598) The same error here. Any solution? — Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you commented.Message ID: ***@***.***>

JackSacali · 2024-08-06T11:56:47Z

I have a similar issue using react and apexcharts, I solved it using cloneDeep from lodash to pass the series array:

const chartOptions: ApexOptions = {
  series: cloneDeep(series),
  ...otherOptions,
};

madebywitteveen · 2024-08-06T18:52:08Z

Thanks 👍

…

________________________________ From: Jack Sacali ***@***.***> Sent: Tuesday, August 6, 2024 13:57 To: apexcharts/react-apexcharts Cc: madebywitteveen; Comment Subject: Re: [apexcharts/react-apexcharts] apexcharts.common.js:6 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'group') (Issue #598) I have a similar issue using react and apexcharts, I solved it using cloneDeep from lodash to pass the series array: const chartOptions: ApexOptions = { series: cloneDeep(series), ...otherOptions, }; — Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you commented.Message ID: ***@***.***>

d0dge · 2024-10-11T10:16:09Z

I'm having this issue too. It doesn't prevent charts from rendering but it does seem to slow down that rendering quite a lot, which isn't great.

AyushBawane · 2024-10-21T08:24:03Z

one solution that worked for me is, add check on your component's top. check if data is undefined.

if(data === undefined) return ;

u can then may be memoize the component or parent according data change or how u want to render the component.

leocharrua · 2024-10-29T20:12:36Z

Hello, I had a similar error with angular:

node_modules_apexcharts_dist_apexcharts_common_js.js:2 TypeError: Cannot read properties of null (reading 'hidden')
at apexcharts.common.js:14:37898
at Array.forEach ()
at t.value (apexcharts.common.js:14:37873)
at t.create (apexcharts.common.js:6:4908)
at apexcharts.common.js:14:37096
at new ZoneAwarePromise (zone.js:2702:25)
at t.value (apexcharts.common.js:14:21791)
at ng-apexcharts.mjs:113:74
at _ZoneDelegate.invoke (zone.js:369:28)
at ZoneImpl.run (zone.js:111:43)

madebywitteveen · 2024-10-29T20:33:51Z

Ok thanks a lot 😄

…

________________________________ From: leocharrua ***@***.***> Sent: Tuesday, October 29, 2024 21:12 To: apexcharts/react-apexcharts Cc: madebywitteveen; Comment Subject: Re: [apexcharts/react-apexcharts] apexcharts.common.js:6 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'group') (Issue #598) Hello, I had a similar error with angular: node_modules_apexcharts_dist_apexcharts_common_js.js:2 TypeError: Cannot read properties of null (reading 'hidden') at apexcharts.common.js:14:37898 at Array.forEach () at t.value (apexcharts.common.js:14:37873) at t.create (apexcharts.common.js:6:4908) at apexcharts.common.js:14:37096 at new ZoneAwarePromise (zone.js:2702:25) at t.value (apexcharts.common.js:14:21791) at ng-apexcharts.mjs:113:74 at _ZoneDelegate.invoke (zone.js:369:28) at ZoneImpl.run (zone.js:111:43) — Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you commented.Message ID: ***@***.***>

NRevillet mentioned this issue Aug 12, 2024

Uncaught (in promise) TypeError: can't access property "show", i is undefined #619

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

apexcharts.common.js:6 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'group') #598

apexcharts.common.js:6 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'group') #598

sai12-creator commented Apr 25, 2024

RodolfoRdz11 commented May 28, 2024

madebywitteveen commented Jun 9, 2024

DevelopJKong commented Jun 25, 2024

seniordev-ca commented Jun 27, 2024

sai12-creator commented Jun 27, 2024

seniordev-ca commented Jun 27, 2024

seniordev-ca commented Jun 27, 2024

sai12-creator commented Jun 27, 2024

RodolfoRdz11 commented Jun 27, 2024

jutdinh commented Jul 21, 2024

madebywitteveen commented Jul 21, 2024 via email

pedroeckel commented Aug 1, 2024

madebywitteveen commented Aug 1, 2024 via email

JackSacali commented Aug 6, 2024

madebywitteveen commented Aug 6, 2024 via email

d0dge commented Oct 11, 2024

AyushBawane commented Oct 21, 2024

leocharrua commented Oct 29, 2024

madebywitteveen commented Oct 29, 2024 via email

apexcharts.common.js:6 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'group') #598

apexcharts.common.js:6 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'group') #598

Comments

sai12-creator commented Apr 25, 2024

RodolfoRdz11 commented May 28, 2024

madebywitteveen commented Jun 9, 2024

DevelopJKong commented Jun 25, 2024

seniordev-ca commented Jun 27, 2024

sai12-creator commented Jun 27, 2024

seniordev-ca commented Jun 27, 2024

seniordev-ca commented Jun 27, 2024

sai12-creator commented Jun 27, 2024

RodolfoRdz11 commented Jun 27, 2024

jutdinh commented Jul 21, 2024

madebywitteveen commented Jul 21, 2024 via email

pedroeckel commented Aug 1, 2024

madebywitteveen commented Aug 1, 2024 via email

JackSacali commented Aug 6, 2024

madebywitteveen commented Aug 6, 2024 via email

d0dge commented Oct 11, 2024

AyushBawane commented Oct 21, 2024

leocharrua commented Oct 29, 2024

madebywitteveen commented Oct 29, 2024 via email