Skip to content

Instantly share code, notes, and snippets.

@chintanparikh
Created May 26, 2016 11:37
Show Gist options
  • Save chintanparikh/973b234e6353941b175eaa29f7d283fd to your computer and use it in GitHub Desktop.
Save chintanparikh/973b234e6353941b175eaa29f7d283fd to your computer and use it in GitHub Desktop.
import React, { PropTypes } from 'react';
export default class ProgressPieChart extends React.Component {
degrees() {
return 360 * this.props.percent / 100;
}
render() {
let gt50 = (this.props.percent > 50 ? 'gt-50' : '' );
let full = (this.props.percent == 50 ? 'full' : '');
return (
<div className={`progress-pie-chart ${gt50}`}>
<div className="ppc-progress">
<div className="ppc-progress-fill" style={{transform: `rotate(${this.degrees()}deg)`}}></div>
</div>
<div className="ppc-percents">
<div className="pcc-percents-wrapper">
<span className={full}></span>
</div>
</div>
</div>
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment