JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>
<div id="chartDiv"></div>

CSS

body {
    font-family: Arial, Verdana, sans-serif;
}

JavaScript

$(document).ready(function(){
		var tasks = [{
    name: 'Eat',
    intervals: [{
        from: 1360195200000,
        to: 1360281600000,
    },{
        from: 1360368000000,
        to: 1360454400000,
    },{
        from: 1360800000000,
        to: 1360886400000
    }, {
        from: 1361059200000,
        to: 1361232000000
    }]},
    {
    name: 'sleep',
    intervals: [{
        from: 1360195200000,
        to: 1360281600000,
    },{
        from: 1360368000000,
        to: 1360454400000,
    },{
        from: 1360800000000,
        to: 1360886400000
    },{
        from: 1361059200000,
        to: 1361232000000
    }]},
    {
    name: 'work',
    intervals: [{
        from: 1360195250000,
        to: 1360281650000,
    },{
        from: 1360368500000,
        to: 1360454450000,
    },{
        from: 1360850000000,
        to: 1360886450000
    }, {
        from: 1361059250000,
        to: 1361231500000
    }]
}];

// Define milestones
var milestones = [];

// re-structure the tasks into line seriesvar series = [];
var series = [];
$.each(tasks.reverse(), function (i, task) {
    var item = {
        name: task.name,
        data: []
    };
    $.each(task.intervals, function (j, interval) {
        item.data.push({
            x: interval.from,
            y: i,
            label: interval.label,
            from: interval.from,
            to: interval.to
        }, {
            x: interval.to,
            y: i,
            from: interval.from,
            to: interval.to
        });

        // add a null value between intervals
        if (task.intervals[j + 1]) {
            item.data.push(
            [(interval.to + task.intervals[j + 1].from) / 2, null]);
        }

    });

    series.push(item);
});

// restructure the milestones
$.each(milestones, function (i, milestone) {
    var item = Highcharts.extend(milestone, {
        data: [
            [
            milestone.time,
            milestone.task]
        ],
        type: 'scatter'
   ...