Frame Type in EJ 1 Angular PivotGauge

12 Jan 2018 / 2 minutes to read

Full Circle

Full Circle frame lets the PivotGauge display in circular shape. Frame type can be set using the frameType. By default, the frame type is “fullcircle”.

html

<ej-pivotgauge [frame]="frame" >
</ej-pivotgauge>

ts

//..

export class PivotGaugeComponent {
public scales;
    constructor() {
        //..
        this.frame = { frameType: "fullcircle" }
    }
}

Half Circle

Half Circle frame lets the PivotGauge to display in semi-circular shape. For this, frame type needs to be set as “halfcircle” within the frameType property and need to set startAngle and sweepAngle for the PivotGauge in the scales property.

html

<ej-pivotgauge [frame]="frame"  [scales]="scales">
</ej-pivotgauge>

ts

//..

export class PivotGaugeComponent {
public scales;
    constructor() {
        //..
        this.frame = { 
            frameType: 'halfcircle',
            halfCircleFrameStartAngle: 180, 
            halfCircleFrameEndAngle: 360
        };
        this.scales: [{
            //..
            startAngle: 180, 
            sweepAngle: 180
            //..
        }];
    }
}