41 lines
1.2 KiB
HTML
41 lines
1.2 KiB
HTML
<canvas id="chartjs_completude" style="position: relative; height:40vh; width:80vw"></canvas>
|
|
|
|
<script type="text/javascript">
|
|
|
|
var completude_data = {
|
|
datasets:[{
|
|
borderWidth: 0,
|
|
data: [
|
|
{{ nb_skill_masterised }},
|
|
{{ nb_skill_chained }},
|
|
{{ nb_skill_without_help }},
|
|
{{ nb_skill_whith_help }},
|
|
{{ nb_unknown_skill }}
|
|
],
|
|
backgroundColor: [
|
|
"#1CA8DD",
|
|
"#1BC98E", /*"#1ca8dd",*/
|
|
"#FEFB01",
|
|
"#FF9300",
|
|
"#FF2F92", /*"#1bc98e"*/
|
|
]
|
|
}],
|
|
labels: ['Skill masterised', 'Chained skills ', 'Skills without help', 'Skills with help', 'Unknown Skills'],
|
|
};
|
|
|
|
new Chart(document.getElementById("chartjs_completude"),{
|
|
responsive: true,
|
|
maintainAspectRatio: true,
|
|
type: "doughnut",
|
|
data: completude_data,
|
|
options: {
|
|
plugins: {
|
|
legend: {
|
|
display: false,
|
|
},
|
|
},
|
|
cutoutPercentage: 55,
|
|
maintainAspectRatio: false,
|
|
},
|
|
});
|
|
</script> |