let dummydata1 = [40, 30, 20];
let questionOptionsDummy1 = ['disgusting','clean', 'fine' ];

let dummydata2 = [25, 35, 40];
let questionOptionsDummy2 = ['Option A', 'Option B', 'Option C'];

let dummydata3 = [30, 20, 20];
let questionOptionsDummy3 = ['Option A', 'Option B', 'Option C'];

let dummydata4 = [30, 20, 20];
let questionOptionsDummy4 = ['Option A', 'Option B', 'Option C'];

let dummydata5 = [30, 20, 20];
let questionOptionsDummy5 = ['Option A', 'Option B', 'Option C'];

const question1Data = new QuestionCreationClass(dummydata1,questionOptionsDummy1)
const question2Data = new QuestionCreationClass(dummydata2,questionOptionsDummy2)
const question3Data = new QuestionCreationClass(dummydata3, questionOptionsDummy3);
const question4Data = new QuestionCreationClass(dummydata4, questionOptionsDummy4);
const question5Data = new QuestionCreationClass(dummydata5, questionOptionsDummy5);

const chartConfig1 = {
    type: 'pie',
    data: question1Data.questionData,
    options: {
        responsive: true,
        legend: {
            position: 'top',
        },
        title: {
            display: true,
            text: 'Question 1 Responses'
        },
        animation: {
            animateScale: true,
            animateRotate: true
        }
    }
};

const chartConfig2 = {
    type: 'pie',
    data: question2Data.questionData,
    options: {
        responsive: true,
        legend: {
            position: 'top',
        },
        title: {
            display: true,
            text: 'Question 2 Responses'
        },
        animation: {
            animateScale: true,
            animateRotate: true
        }
    }
};

const chartConfig3 = {
    type: 'pie',
    data: question3Data.questionData,
    options: {
        responsive: true,
        legend: {
            position: 'top',
        },
        title: {
            display: true,
            text: 'Question 3 Responses'
        },
        animation: {
            animateScale: true,
            animateRotate: true
        }
    }
};

const chartConfig4 = {
    type: 'pie',
    data: question4Data.questionData,
    options: {
        responsive: true,
        legend: {
            position: 'top',
        },
        title: {
            display: true,
            text: 'Question 4 Responses'
        },
        animation: {
            animateScale: true,
            animateRotate: true
        }
    }
};

const chartConfig5 = {
    type: 'pie',
    data: question5Data.questionData,
    options: {
        responsive: true,
        legend: {
            position: 'top',
        },
        title: {
            display: true,
            text: 'Question 5 Responses'
        },
        animation: {
            animateScale: true,
            animateRotate: true
        }
    }
};

// Create the charts
const ctx1 = document.getElementById('chart1').getContext('2d');
const myChart1 = new Chart(ctx1, chartConfig1);

const ctx2 = document.getElementById('chart2').getContext('2d');
const myChart2 = new Chart(ctx2, chartConfig2);

const ctx3 = document.getElementById('chart3').getContext('2d');
const myChart3 = new Chart(ctx3, chartConfig3);

const ctx4 = document.getElementById('chart4').getContext('2d');
const myChart4 = new Chart(ctx4, chartConfig4);

const ctx5 = document.getElementById('chart5').getContext('2d');
const myChart5 = new Chart(ctx5, chartConfig5);