graph

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;