JSFiddle - React, Tailwind, and code Playground
by lvlaxpt
HTML
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<canvas id="myChart" width="400" height="400"></canvas>
<script>
const data3 = {
labels: ["Italy", "France", "Spain", "USA", "Argentina"],
datasets: [
{
label: "Data set 1",
data: [40, 40, 50, 30, 29],
borderColor: "#F5B041",
backgroundColor: "rgba(245, 176, 65, 0.8)"
}
]
};
const options3 = {
responsive: true,
plugins: {
title: {
display: true,
text: 'Chart.js Radar Chart'
}
},
elements: {
line: {
tension: 0.000001
}
},
scale: {
gridLines: {
display: true,
lineWidth: 0.5,
color: '#F5B041'
},
angleLines: {
display: true,
lineWidth: 0.5,
color: '#F5B041'
}
}
};
new Chart("myChart", {
type: "radar",
data: data3,
options: options3
});
</script>