import { Component , Input } from '@angular/core' ; import { trigger , state , style , transition , animate } from "@angular/animations" ; @ Component ( { selector : 'chart-donut' , templateUrl : 'chart-donut.component.html' , animations : [ trigger ( 'showAnimation' , [ transition ( ':enter' , [ style ( { opacity : 0 } ) , animate ( "500ms" , style ( { opacity : 1 } ) ) ] ) ] ) ] } ) export class ChartDonutComponent { @ Input ( ) data : any ; constructor ( ) { } generateStripePath ( x , y , innerRadius , outerRadius , start , size ) { if ( size >= 1 ) size = 0.9999 ; innerRadius = Math . max ( innerRadius , 0 ) ; outerRadius = Math . max ( outerRadius , innerRadius ) ; size = Math . max ( size , 0 ) ; if ( size == 0 || size == 1 ) start = 0 ; var startAngle = 2 * Math . PI * start ; var angle = 2 * Math . PI * size ; var startX1 = x + Math . sin ( startAngle ) * outerRadius ; var startY1 = y - Math . cos ( startAngle ) * outerRadius ; var endX1 = x + Math . sin ( startAngle + angle ) * outerRadius ; var endY1 = y - Math . cos ( startAngle + angle ) * outerRadius ; var startX2 = x + Math . sin ( startAngle + angle ) * innerRadius ; var startY2 = y - Math . cos ( startAngle + angle ) * innerRadius ; var endX2 = x + Math . sin ( startAngle ) * innerRadius ; var endY2 = y - Math . cos ( startAngle ) * innerRadius ; var outerArc = ( size > 0.5 ? 1 : 0 ) ; var properties = [ ] ; properties . push ( "M" + startX1 + "," + startY1 ) ; properties . push ( "A" + outerRadius + "," + outerRadius + " 0 " + outerArc + ",1 " + endX1 + "," + endY1 ) ; properties . push ( "L" + startX2 + "," + startY2 ) ; properties . push ( "A" + innerRadius + "," + innerRadius + " 0 " + outerArc + ",0 " + endX2 + "," + endY2 ) ; properties . push ( "Z" ) ; return properties . join ( " " ) ; } }