$(document).ready(function () {

            $.ajax({
                url: "remoteService",
                dataType: "json",
                success: function (data) {
                    initChart(data);
                }
            });
        });

        function initChart(data) {

            // the result data should be like:
            //
            //data = {
            //    user1 : [
            //        ['Design', new Date(2010, 0, 1), new Date(2010, 0, 20)],
            //        ['Development', new Date(2010, 0, 21), new Date(2010, 1, 15)],
            //        ['Design', new Date(2010, 1, 16), new Date(2010, 1, 28)],
            //        ['Development', new Date(2010, 2, 1), new Date(2010, 2, 20)],
            //        ['Testing', new Date(2010, 2, 21), new Date(2010, 3, 10)]
            //    ],
            //    user2 : [
            //        ['Design', new Date(2010, 0, 21), new Date(2010, 1, 15)],
            //        ['Development', new Date(2010, 1, 16), new Date(2010, 1, 28)],
            //        ['Testing', new Date(2010, 2, 1), new Date(2010, 2, 20)]
            //    ],
            //    user3: [
            //        ['Design'],
            //        ['Development', new Date(2010, 2, 21), new Date(2010, 3, 10)],
            //        ['Testing', new Date(2010, 1, 16), new Date(2010, 1, 28)],
            //        ['Testing', new Date(2010, 3, 11), new Date(2010, 4, 1)]
            //    ]
            //};

            $('#jqChart').jqChart({
                title: { text: 'Project Schedule' },
                animation: { duration: 1 },
                shadows: {
                    enabled: true
                },
                series: [
                    {
                        type: 'gantt',
                        title: 'Alan',
                        data: data.user1
                    },
                    {
                        type: 'gantt',
                        title: 'Carrie',
                        data: data.user2
                    },
                    {
                        type: 'gantt',
                        title: 'Katie',
                        data: data.user3
                    }
                ]
            });
        };