diff --git a/src/components/Graph.tsx b/src/components/Graph.tsx index d4c4ce24a0efba7f585463bf1a308c2d4927fc1d..9b94b34e7dc33bc7b6d8adc174cbe6f559e1df3d 100644 --- a/src/components/Graph.tsx +++ b/src/components/Graph.tsx @@ -449,18 +449,20 @@ export const BasicPosition: React.FC = () => { }; export const AgeDiagnosis: React.FC = () => { - const labels = ['>20', '10-20', '1-10', 'first months', 'first week', '']; + const labels = ['>20', '10-20', '1-10', 'first months', 'first week', 'Newborn Screening', 'Before birth']; const data = { labels, datasets: [ { label: 'Dataset 1', data: [ - 2.14, - 5.17, - 27.14, - 30.00, - 35.00 + 3.83, + 2.73, + 26.23, + 21.86, + 18.03, + 26.23, + 1.09 ], backgroundColor: 'rgba(255, 99, 132, 0.5)', }, @@ -486,6 +488,38 @@ export const AgeDiagnosis: React.FC = () => { ); }; +export const HeadrofGeneTherapy: React.FC = () => { + const data = { + labels: ['Yes', 'No'], + datasets: [ + { + label: 'Percentage', + data: [ + 76.76, + 23.24 + ], + backgroundColor: [ + 'rgba(255, 99, 132, 0.2)', + 'rgba(54, 162, 235, 0.2)', + ], + borderColor: [ + 'rgba(255, 99, 132, 1)', + 'rgba(54, 162, 235, 1)', + ], + borderWidth: 1, + }, + ], + }; + const options = { + responsive: true, + maintainAspectRatio: false + }; + return ( + <div className="pie-chart-container"> + <Pie data={data} options={options} /> + </div> + ); +}; export default PieChart;