legend: {

          display: false
        },

src/components/Graph.tsx

 import { Pie } from 'react-chartjs-2';
 import React from 'react';
 import { Bar } from 'react-chartjs-2';
-import { Chart as ChartJS, Tooltip, Legend,ArcElement, BarElement, CategoryScale, LinearScale, Title, RadialLinearScale } from 'chart.js';
+import { Chart as ChartJS, Tooltip, Legend,ArcElement, BarElement, CategoryScale, LinearScale, Title, RadialLinearScale, plugins } from 'chart.js';
 
 const backgroundcolorscale = [
           'rgba(133, 15, 120, 0.2)',
@@ -55,10 +55,12 @@ const PieChart: React.FC = () => {
   const options = {
     responsive: true,
     maintainAspectRatio: false,
-    title: {
-      display: true,
-      text: '',
-    },
+    plugins: {
+      title: {
+        display: true,
+        text: '',
+      },
+    }
   };
 
   return (
@@ -90,9 +92,11 @@ export const OpenToGeneTherapyatients: React.FC = () => {
   const options = {
     responsive: true,
     maintainAspectRatio: false,
-    title: {
-      display: true,
-      text: 'Would you be open to gene therapy if it could significantly improve your symptoms?',
+    plugins: {
+      title: {
+        display: true,
+        text: 'Would you be open to gene therapy if it could significantly improve your symptoms?',
+      },
     },
   };
 
@@ -126,10 +130,12 @@ export const MostStressfulForRelativeatients: React.FC = () => {
   const options = {
     responsive: true,
     maintainAspectRatio: false,
-    title: {
-      display: true,
-      text: 'Which aspects of the disease are most stressful for you or your relative?',
-    },
+    plugins: {
+      title: {
+        display: true,
+        text: 'Which aspects of the disease are most stressful for you or your relative?',
+      },
+    }
   };
 
   return (
@@ -158,10 +164,12 @@ export const WhoAffectedatients: React.FC = () => {
   const options = {
     responsive: true,
     maintainAspectRatio: false,
-    title: {
-      display: true,
-      text: 'Are you affected by cystic fibrosis yourself or are you related to someone with cystic fibrosis?',
-    },
+    plugins: {
+      title: {
+        display: true,
+        text: 'Are you affected by cystic fibrosis yourself or are you related to someone with cystic fibrosis?',
+      },
+    }
   };
 
   return (
@@ -226,7 +234,9 @@ export const HowOftenTreatmentatients: React.FC = () => {
   const options = {
       responsive: true,
       plugins: {
-        
+        legend: {
+          display: false
+        },
         title: {
           display: true,
           text: 'How often do you or your relative need medical treatment or therapy?',
@@ -263,7 +273,9 @@ export const WhatCocernsAboutGeneTherapyatients: React.FC = () => {
   const options = {
       responsive: true,
       plugins: {
-        
+        legend: {
+          display: false
+        },
         title: {
           display: true,
           text: 'What concerns do you have about gene therapy?',
@@ -300,7 +312,9 @@ export const HowMuchDoesItAffectYouatients: React.FC = () => {
   const options = {
       responsive: true,
       plugins: {
-        
+        legend: {
+          display: false
+        },
         title: {
           display: true,
           text: "How much does cystic fibrosis affect your or your relative's daily life? (1 = Not at all, 5 = Very much)"
@@ -339,7 +353,9 @@ export const WhichTherapyDoYouUseatients: React.FC = () => {
   const options = {
       responsive: true,
       plugins: {
-        
+        legend: {
+          display: false
+        },
         title: {
           display: true,
           text: 'Which form(s) of therapy do you or your relative use?',
@@ -380,7 +396,9 @@ export const WhichSymptomsatients: React.FC = () => {
   const options = {
       responsive: true,
       plugins: {
-        
+        legend: {
+          display: false
+        },
         title: {
           display: true,
           text: 'Which symptoms do you or your relative have most frequently?',
@@ -417,7 +435,9 @@ export const BasicPositionatients: React.FC = () => {
   const options = {
       responsive: true,
       plugins: {
-        
+        legend: {
+          display: false
+        },
         title: {
           display: true,
           text: 'What is your basic position on gene therapy? (1=Very negative, 5=Very positive)',
@@ -455,7 +475,9 @@ export const AgeDiagnosisatients: React.FC = () => {
   const options = {
       responsive: true,
       plugins: {
-        
+        legend: {
+          display: false
+        },
         title: {
           display: true,
           text: 'At what age were you or your relative diagnosed with cystic fibrosis?',
@@ -489,10 +511,12 @@ export const HeadrofGeneTherapyPatients: React.FC = () => {
   const options = {
     responsive: true,
     maintainAspectRatio: false,
-    title: {
-      display: true,
-      text: 'Have you ever heard of gene therapy?',
-    },
+    plugins: {
+      title: {
+        display: true,
+        text: 'Have you ever heard of gene therapy?',
+      },
+    }
   };
 
   return (
@@ -569,10 +593,12 @@ export const HeardOfCFPublic: React.FC = () => {
   const options = {
     responsive: true,
     maintainAspectRatio: false,
-    title: {
-      display: true,
-      text: 'Have you heard of cystic fibrosis?',
-    },
+    plugins: {
+      title: {
+        display: true,
+        text: 'Have you heard of cystic fibrosis?',
+      },
+    }
   };
 
   return (
@@ -602,10 +628,12 @@ export const HeadOfGeneTherapyPublic: React.FC = () => {
   const options = {
     responsive: true,
     maintainAspectRatio: false,
-    title: {
-      display: true,
-      text: 'Have you ever heard of gene therapy?',
-    },
+    plugins: {
+      title: {
+        display: true,
+        text: 'Have you ever heard of gene therapy?',
+      },
+    }
   };
 
   return (
@@ -639,7 +667,9 @@ export const HowDidYouLearnPublic: React.FC = () => {
   const options = {
       responsive: true,
       plugins: {
-        
+        legend: {
+          display: false
+        },
         title: {
           display: true,
           text: 'How did you mainly learn about cystic fibrosis? ',
@@ -675,10 +705,12 @@ export const HowWellDoYouUnderstandGFPublic: React.FC = () => {
   const options = {
     responsive: true,
     maintainAspectRatio: false,
-    title: {
-      display: true,
-      text: 'How well do you understand what gene therapy is?',
-    },
+    plugins: {
+      title: {
+        display: true,
+        text: 'How well do you understand what gene therapy is?',
+      },
+    }
   };
 
   return (
@@ -709,10 +741,11 @@ export const HowWellInformedAboutCFPublic: React.FC = () => {
   const options = {
     responsive: true,
     maintainAspectRatio: false,
-    title: {
-      display: true,
-      text: 'How well informed are you about cystic fibrosis?',
-    },
+      plugins: { title: {
+        display: true,
+        text: 'How well informed are you about cystic fibrosis?',
+      },
+    }
   };
 
   return (
@@ -742,10 +775,10 @@ export const WhatCouldGeneTherapyMeanForMedicinePublic: React.FC = () => {
   const options = {
     responsive: true,
     maintainAspectRatio: false,
-    title: {
+    plugins: {title: {
       display: true,
       text: 'What do you think gene therapy could mean for medicine?',
-    },
+    },}
   };
 
   return (
@@ -782,7 +815,9 @@ export const WhatMeasuresPublic: React.FC = () => {
   const options = {
       responsive: true,
       plugins: {
-        
+        legend: {
+          display: false
+        },
         title: {
           display: true,
           text: 'What measures do you think could be taken to raise awareness of cystic fibrosis?',
@@ -818,10 +853,12 @@ export const WouldYouDoGeneTherapyPublic: React.FC = () => {
   const options = {
     responsive: true,
     maintainAspectRatio: false,
-    title: {
-      display: true,
-      text: 'Would you opt for gene therapy yourself?',
-    },
+    plugins: {
+      title: {
+        display: true,
+        text: 'Would you opt for gene therapy yourself?',
+      },
+    }
   };
 
   return (
@@ -855,7 +892,9 @@ export const WhatCocernsAboutGeneTherapyPublic: React.FC = () => {
   const options = {
       responsive: true,
       plugins: {
-        
+        legend: {
+          display: false
+        },
         title: {
           display: true,
           text: 'What concerns do you have about gene therapy?',
@@ -896,7 +935,9 @@ export const WhatFormMoreInfoPublic: React.FC = () => {
   const options = {
       responsive: true,
       plugins: {
-        
+        legend: {
+          display: false
+        },
         title: {
           display: true,
           text: 'In what form would you like to see more information?',