[alexkorParticipant]

ok i still have the issue becouse i pass the chart configuration as input.
when i use it in the component it works, but when i pass as input it not work.

<jqxChart #myChart (onClick)="onChartClick($event)" [height]="300" [showLegend]="true" [enableAnimations]="true"
  [source]="dataAdapter" [showBorderLine]="false" [seriesGroups]="chartConfiguration">
</jqxChart>

import { Component, OnInit, Output, Input, AfterViewInit } from '@angular/core';
import { EventEmitter } from '@angular/core';
import { HealthService } from '../Health/health.service';

@Component({
  selector: 'app-pie-chart',
  templateUrl: './pie-chart.component.html',
  styleUrls: ['./pie-chart.component.css']
})
export class PieChartComponent implements OnInit {

  @Output() ChartClick = new EventEmitter();
  @Input() chartConfiguration;
  @Input() chartData;
  dataAdapter;
  constructor() {
  }

  onChartClick(e) {
    this.ChartClick.emit(e);
  }

  ngOnInit(): void {
    this.dataAdapter = new jqx.dataAdapter(this.chartData, {
      async: false, autoBind: true
    });
  }
}

<app-pie-chart [chartConfiguration]="pieChartConfig" [chartData]="pieChartDataSource" (ChartClick)="onChartClick($event)"></app-pie-chart>

 ngOnInit(): void {
    this.pieChartDataSource = this.healthConfigService.generatePieChartDataSource();
    this.pieChartConfig = this.healthConfigService.getPieChartAlertsConfig(1851);
  }

generatePieChartAlertDataSource() {
    return {
      datatype: 'json',
      datafields: [
        { name: 'alertType', type: 'string' },
        { name: 'total', type: 'number' }
      ],
      url: '../assets/desktop_browsers_share_dec2011.json'
    };
  }
  getPieChartAlertsConfig(total) {
    return [
      {
        type: 'pie',
        showLabels: false,
        series:
          [
            {
              dataField: 'total',
              displayText: 'alertType',
              labelRadius: 120,
              initialAngle: 15,
              radius: 90,
              centerOffset: 0,

              toolTipFormatFunction: function (value) {
                if (isNaN(value)) {
                  return value;
                }
                return (value / total * 100).toFixed(2) + "%" + '(' + value + ')';
              },
              legendFormatFunction: function (value, itemIndex, serie, group) {
                debugger;
                return 'test';
              }
            }
          ]
      }
    ];
  }

[alexkorParticipant]

the issue fixed, the post can be deleted

[alexkorParticipant]

thanks.

[alexkorParticipant]

thanks

[alexkorParticipant]

ok thanks
one more qustion
do you have a component with rounded progress bar?
something similar to this
https://stackoverflow.com/questions/36639660/android-circular-progress-bar-with-rounded-corners

i didn’t found in the docs maybe i missed it

[alexkorParticipant]

im confused with the docs.
i need the pieChart that is in this docs
https://www.jqwidgets.com/angular/angular-chart/#https://www.jqwidgets.com/angular/angular-chart/angular-chart-pieseries.htm

but this docs not have the piechart
https://www.jqwidgets.com/angular-components-documentation/documentation/angular-cli-with-jqwidgets-ng/index.htm?search=

witch of the docs i need to use?

[alexkorParticipant]

i did it and im getting this error
ERROR in node_modules/jqwidgets-scripts/jqwidgets-ng/jqwidgets.d.ts(18,18): error TS2300: Duplicate identifier ‘widget’.
node_modules/jqwidgets-scripts/jqwidgets-ng/jqwidgets.d.ts(3181,18): error TS2300: Duplicate identifier ‘PivotGridDesigner’.
node_modules/jqwidgets-scripts/jqwidgets-ts/jqwidgets.d.ts(18,18): error TS2300: Duplicate identifier ‘widget’.
node_modules/jqwidgets-scripts/jqwidgets-ts/jqwidgets.d.ts(3181,18): error TS2300: Duplicate identifier ‘PivotGridDesigner’.

[Author]

Posts