diff --git a/src/components/Graph.tsx b/src/components/Graph.tsx
index dfbc163f5c34d1625ee0d2d3e0c33948c7dc52cc..e9899eb91de31efb5d2fe4ff510106fecfcbe384 100644
--- a/src/components/Graph.tsx
+++ b/src/components/Graph.tsx
@@ -1,7 +1,7 @@
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?',