SA - amexio-d3-chart-donut

[arafkarsh]

Sender: vishnupriya.b@jeanmartin.com Comment: The donut chart not showing. The error be like ERROR TypeError: "Cannot read property 'forEach' of undefined in amexio-d3-chart-donut". My data be like (6) [Array(3), Array(3), Array(3), Array(3), Array(3), Array(3)]. Can you help me to get the donut datas? Open #43 in Usersnap Dashboard

Download original image

Browser: Chrome 75 (Linux) Referer: https://api.amexio.org/api/v5.16/index.html#/concept-page Screen size: 1366 x 768 Browser size: 1299 x 669

Powered by usersnap.com

[priyavenkat95]

Any Solution?

[rashmithakkar]

@priyavenkat95 We need a proper sample data which is provided to donut chart. Can you please send the data.

[priyavenkat95]

Below data is my sample Json data {"donutDatas" : [ { "assetClass": "Cash and Short Term Fixed Income", "currentValue": "100,527.61", "currentPercent": "5.40%", "colorCode": "#ff7600" }, { "assetClass": "Fixed Income", "currentValue": "385,773.45", "currentPercent": "20.72%", "colorCode": "#2f296b" }, { "assetClass": "International Equity", "currentValue": "236,582.42", "currentPercent": "12.71%", "colorCode": "#7e4a35" }, { "assetClass": "US Equity", "currentValue": "997,646.18", "currentPercent": "53.58%", "colorCode": "#6b5b95" }, { "assetClass": "Alternative Investments", "currentValue": "141,399.59", "currentPercent": "7.59%", "colorCode": "#feb236" } ] } I am using a function like that putDonutData() { this.snapshotService.getDonutData().subscribe(data => { this.userDefineColorData = this.setDonutData(data['donutDatas']); console.log(this.userDefineColorData); }); } setDonutData(data) { data.forEach((element, index) => { let donut = []; donut = [element.assetClass, element.currentValue, element.currentPercent]; data[index] = donut; }, this); const lable = ['assetClass', 'currentValue', 'currentPercent']; data.unshift(lable); return data; }

Note : I put my function in constructor. I bind my values( userDefineData) into the html

          <amexio-d3-chart-donut [label]="false" [width]="230" [color]="userDefineColors"
            [data]="userDefineColorData" (onChartClick)="onDefaultChartClick($event)"
            (onLegendClick)="onUserDefineLegendClick($event)">
          </amexio-d3-chart-donut>

[Manisha1205]

Refer this stackblitz example.

The data provided by you is used in above example.

[priyavenkat95]

Hi Manisha,

I want this JSON data will show via a service call. Will you show me that kind of examples? I used a service call method in the above-mentioned examples.

[Manisha1205]

Hello, Refer this stackblitz example, here i have used local json data , instead you can use json data received by http call

[priyavenkat95]

Hi Manisha, I tried in your way. The donut chart is shown in black color but the [color] is not working.

[rashmithakkar]

Hi @priyavenkat95 ,

We are unable to reproduce the issue that you are facing.