128 lines
2.4 KiB
JavaScript
128 lines
2.4 KiB
JavaScript
const data = [
|
|
{
|
|
id: '0.0',
|
|
parent: '',
|
|
name: 'toutes'
|
|
},
|
|
{
|
|
id: 'future',
|
|
parent: '0.0',
|
|
name: 'prévues',
|
|
value: 357
|
|
},
|
|
|
|
{
|
|
id: 'past',
|
|
parent: '0.0',
|
|
name: 'finies',
|
|
value: 1148
|
|
},
|
|
{
|
|
id: '1.3',
|
|
parent: 'future',
|
|
name: 'NEXT',
|
|
value: 12
|
|
},
|
|
{
|
|
id: '1.1',
|
|
parent: 'future',
|
|
name: 'SOMEDAY',
|
|
value: 313
|
|
},
|
|
{
|
|
id: '1.2',
|
|
parent: 'past',
|
|
name: 'DONE',
|
|
value: 1110
|
|
},
|
|
{
|
|
id: '1.4',
|
|
parent: 'past',
|
|
name: 'CANCELLED',
|
|
value: 12
|
|
},
|
|
{
|
|
id: '1.5',
|
|
parent: 'future',
|
|
name: 'WAITING',
|
|
value: 0
|
|
},
|
|
{
|
|
id: '1.6',
|
|
parent: 'future',
|
|
name: 'TODO',
|
|
value: 44
|
|
}
|
|
];
|
|
|
|
|
|
Highcharts.chart('container', {
|
|
|
|
chart: {
|
|
height: '100%'
|
|
},
|
|
|
|
// Let the center circle be transparent
|
|
colors: ['transparent'].concat(Highcharts.getOptions().colors),
|
|
|
|
title: {
|
|
text: 'Tâches par état en 2023'
|
|
},
|
|
|
|
subtitle: {
|
|
text: 'Source cipherbliss.com'
|
|
},
|
|
|
|
series: [{
|
|
type: 'sunburst',
|
|
data: data,
|
|
name: 'Root',
|
|
allowDrillToNode: true,
|
|
cursor: 'pointer',
|
|
dataLabels: {
|
|
format: '{point.name}',
|
|
filter: {
|
|
property: 'innerArcLength',
|
|
operator: '>',
|
|
value: 16
|
|
},
|
|
rotationMode: 'circular'
|
|
},
|
|
levels: [{
|
|
level: 1,
|
|
levelIsConstant: false,
|
|
dataLabels: {
|
|
filter: {
|
|
property: 'outerArcLength',
|
|
operator: '>',
|
|
value: 64
|
|
}
|
|
}
|
|
},
|
|
{
|
|
level: 2,
|
|
colorByPoint: true
|
|
},
|
|
{
|
|
level: 3,
|
|
colorVariation: {
|
|
key: 'brightness',
|
|
to: -0.5
|
|
}
|
|
}, {
|
|
level: 4,
|
|
colorVariation: {
|
|
key: 'brightness',
|
|
to: 0.5
|
|
}
|
|
}
|
|
]
|
|
|
|
}],
|
|
|
|
tooltip: {
|
|
headerFormat: '',
|
|
pointFormat: 'The population of <b>{point.name}</b> is <b>{point.value}</b>'
|
|
}
|
|
});
|