var options = {
series: [
{
name: 'Drama',
data: [
{ x: '2024-01-01', y: 32 },
{ x: '2024-02-01', y: 35 },
{ x: '2024-03-01', y: 41 },
{ x: '2024-04-01', y: 38 },
{ x: '2024-05-01', y: 30 },
{ x: '2024-06-01', y: 26 },
{ x: '2024-07-01', y: 24 },
{ x: '2024-08-01', y: 29 },
{ x: '2024-09-01', y: 37 },
{ x: '2024-10-01', y: 44 },
{ x: '2024-11-01', y: 48 },
{ x: '2024-12-01', y: 52 },
],
},
{
name: 'Comedy',
data: [
{ x: '2024-01-01', y: 24 },
{ x: '2024-02-01', y: 22 },
{ x: '2024-03-01', y: 20 },
{ x: '2024-04-01', y: 23 },
{ x: '2024-05-01', y: 27 },
{ x: '2024-06-01', y: 31 },
{ x: '2024-07-01', y: 34 },
{ x: '2024-08-01', y: 33 },
{ x: '2024-09-01', y: 28 },
{ x: '2024-10-01', y: 25 },
{ x: '2024-11-01', y: 26 },
{ x: '2024-12-01', y: 30 },
],
},
{
name: 'Documentary',
data: [
{ x: '2024-01-01', y: 9 },
{ x: '2024-02-01', y: 11 },
{ x: '2024-03-01', y: 14 },
{ x: '2024-04-01', y: 18 },
{ x: '2024-05-01', y: 21 },
{ x: '2024-06-01', y: 19 },
{ x: '2024-07-01', y: 15 },
{ x: '2024-08-01', y: 13 },
{ x: '2024-09-01', y: 12 },
{ x: '2024-10-01', y: 14 },
{ x: '2024-11-01', y: 17 },
{ x: '2024-12-01', y: 16 },
],
},
{
name: 'Sport',
data: [
{ x: '2024-01-01', y: 6 },
{ x: '2024-02-01', y: 14 },
{ x: '2024-03-01', y: 12 },
{ x: '2024-04-01', y: 9 },
{ x: '2024-05-01', y: 11 },
{ x: '2024-06-01', y: 28 },
{ x: '2024-07-01', y: 36 },
{ x: '2024-08-01', y: 31 },
{ x: '2024-09-01', y: 18 },
{ x: '2024-10-01', y: 12 },
{ x: '2024-11-01', y: 10 },
{ x: '2024-12-01', y: 13 },
],
},
{
name: 'Kids',
data: [
{ x: '2024-01-01', y: 18 },
{ x: '2024-02-01', y: 16 },
{ x: '2024-03-01', y: 15 },
{ x: '2024-04-01', y: 17 },
{ x: '2024-05-01', y: 19 },
{ x: '2024-06-01', y: 26 },
{ x: '2024-07-01', y: 33 },
{ x: '2024-08-01', y: 35 },
{ x: '2024-09-01', y: 21 },
{ x: '2024-10-01', y: 18 },
{ x: '2024-11-01', y: 20 },
{ x: '2024-12-01', y: 27 },
],
},
{
name: 'News',
data: [
{ x: '2024-01-01', y: 12 },
{ x: '2024-02-01', y: 13 },
{ x: '2024-03-01', y: 11 },
{ x: '2024-04-01', y: 10 },
{ x: '2024-05-01', y: 12 },
{ x: '2024-06-01', y: 14 },
{ x: '2024-07-01', y: 13 },
{ x: '2024-08-01', y: 15 },
{ x: '2024-09-01', y: 17 },
{ x: '2024-10-01', y: 22 },
{ x: '2024-11-01', y: 29 },
{ x: '2024-12-01', y: 19 },
],
},
],
chart: {
type: 'streamgraph',
height: 380,
},
colors: ['#2E93fA', '#66DA26', '#F97316', '#0EA5E9', '#FACC15', '#E11D48'],
title: {
text: 'Where the streaming hours went',
align: 'left',
},
subtitle: {
text: 'Illustrative data. Thickness is hours; the baseline drifts to keep the bands level.',
align: 'left',
},
xaxis: {
type: 'datetime',
},
tooltip: {
x: {
format: 'MMM yyyy',
},
},
}
var chart = new ApexCharts(document.querySelector('#chart'), options)
chart.render()