React Comparison Chart with Tailwind
remove the sample data...Add the new data const sampleData = { "Lab A": [ { month: 0, value: 45, year: 2022 }, { month: 1, value: 52, year: 2022 }, { month: 2, value: 38, year: 2022 }, { month: 0, value: 65, year: 2023 }, { month: 1, value: 72, year: 2023 }, { month: 2, value: 58, year: 2023 }, ], "Lab B": [ { month: 0, value: 35, year: 2022 }, { month: 1, value: 42, year: 2022 }, { month: 2, value: 28, year: 2022 }, { month: 0, value: 55, year: 2023 }, { month: 1, value: 62, year: 2023 }, { month: 2, value: 48, year: 2023 }, ], "Lab C": [ { month: 0, value: 55, year: 2022 }, { month: 1, value: 62, year: 2022 }, { month: 2, value: 48, year: 2022 }, { month: 0, value: 75, year: 2023 }, { month: 1, value: 82, year: 2023 }, { month: 2, value: 68, year: 2023 }, ], }; Newdata = { "Filters": { "year": [ 2022, 2023 ], "Month": [ "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec" ], "lab": [ { "labshdrid": 2190440000000, "labcode": "OADL", "labname": "ReliableArts" }, { "labshdrid": 2995880000000, "labcode": "YORK", "labname": "YORK Dental Laboratory" }, ] }, "Details": { "Details": [ { "labshdrid": 1004770000000, "labcode": "KDG", "labname": "Knight Dental Group", "Data": { "2022": [ { "Jan": 100 }, { "Feb": 200 }, { "March": 300 }, { "Apr": 400 }, { "May": 500 }, { "Jun": 600 }, { "Jul": 700 }, { "Aug": 800 }, { "Sep": 900 }, { "Oct": 1000 }, { "Nov": 1100 }, { "Dec": 1200 } ], "2023": [ { "Jan": 10 }, { "Feb": 20 }, { "March": 30 }, { "Apr": 40 }, { "May": 50 }, { "Jun": 60 }, { "Jul": 70 }, { "Aug": 80 }, { "Sep": 90 }, { "Oct": 100 }, { "Nov": 110 }, { "Dec": 120 } ] } }, { "labshdrid": 2160770000000, "labcode": "PREC", "labname": "Precision Craft Dental Lab", "Data": { "2022": [ { "Jan": 100 }, { "Feb": 200 }, { "March": 300 }, { "Apr": 400 }, { "May": 500 }, { "Jun": 600 }, { "Jul": 700 }, { "Aug": 800 }, { "Sep": 900 }, { "Oct": 1000 }, { "Nov": 1100 }, { "Dec": 1200 } ], "2023": [ { "Jan": 10 }, { "Feb": 20 }, { "March": 30 }, { "Apr": 40 }, { "May": 50 }, { "Jun": 60 }, { "Jul": 70 }, { "Aug": 80 }, { "Sep": 90 }, { "Oct": 100 }, { "Nov": 110 }, { "Dec": 120 } ] } } ] } }