var options = {
series: [
{
name: 'Alice',
data: [
{
x: 'Design',
y: [
new Date('2024-03-05').getTime(),
new Date('2024-03-08').getTime(),
],
},
{
x: 'Code',
y: [
new Date('2024-03-02').getTime(),
new Date('2024-03-05').getTime(),
],
},
{
x: 'Code',
y: [
new Date('2024-03-05').getTime(),
new Date('2024-03-07').getTime(),
],
},
{
x: 'Test',
y: [
new Date('2024-03-03').getTime(),
new Date('2024-03-09').getTime(),
],
},
{
x: 'Test',
y: [
new Date('2024-03-08').getTime(),
new Date('2024-03-11').getTime(),
],
},
{
x: 'Validation',
y: [
new Date('2024-03-11').getTime(),
new Date('2024-03-16').getTime(),
],
},
{
x: 'Design',
y: [
new Date('2024-03-01').getTime(),
new Date('2024-03-03').getTime(),
],
},
],
},
{
name: 'Ravi',
data: [
{
x: 'Design',
y: [
new Date('2024-03-02').getTime(),
new Date('2024-03-05').getTime(),
],
},
{
x: 'Test',
y: [
new Date('2024-03-06').getTime(),
new Date('2024-03-16').getTime(),
],
goals: [
{
name: 'Break',
value: new Date('2024-03-10').getTime(),
strokeColor: '#CD2F2A',
},
],
},
{
x: 'Code',
y: [
new Date('2024-03-03').getTime(),
new Date('2024-03-07').getTime(),
],
},
{
x: 'Deployment',
y: [
new Date('2024-03-20').getTime(),
new Date('2024-03-22').getTime(),
],
},
{
x: 'Design',
y: [
new Date('2024-03-10').getTime(),
new Date('2024-03-16').getTime(),
],
},
],
},
{
name: 'Mia',
data: [
{
x: 'Code',
y: [
new Date('2024-03-10').getTime(),
new Date('2024-03-17').getTime(),
],
},
{
x: 'Validation',
y: [
new Date('2024-03-05').getTime(),
new Date('2024-03-09').getTime(),
],
goals: [
{
name: 'Break',
value: new Date('2024-03-07').getTime(),
strokeColor: '#CD2F2A',
},
],
},
],
},
],
chart: {
height: 450,
type: 'rangeBar',
},
title: {
text: 'Sprint Schedule by Team Member',
},
plotOptions: {
bar: {
horizontal: true,
barHeight: '80%',
},
},
xaxis: {
type: 'datetime',
},
stroke: {
width: 1,
},
fill: {
type: 'solid',
opacity: 0.6,
},
legend: {
position: 'top',
horizontalAlign: 'left',
},
}
var chart = new ApexCharts(document.querySelector('#chart'), options)
chart.render()