html,

body,

#container {

  width: 100%;

  height: 100%;

  margin: 0;

  padding: 0;

}

anychart.onDocumentReady(function () {

  // The data used in this sample can be obtained from the CDN

  // https://cdn.anychart.com/samples/resource-charts/development-team-plan-time-tracking-on/data.json

  anychart.data.loadJsonFile(

    'https://cdn.anychart.com/samples/resource-charts/development-team-plan-time-tracking-on/data.json',

    function (data) {

      var chart = anychart.resource();

      chart.data(data);

      // set chart zoom level

      chart

        .zoomLevel(1)

        .timeTrackingMode('activity-per-chart')

        .currentStartDate('2016-09-30');

​

      chart.calendar().availabilities([

        {

          each: 'day',

          from: 10,

          to: 18,

          isWorking: true

        },

        {

          each: 'day',

          from: 14,

          to: 15,

          isWorking: false

        },

        {

          each: 'week',

          on: 5,

          isWorking: false

        },

        {

          each: 'week',

          on: 6,

          isWorking: false

        }

      ]);

​

      // set container id for the chart

      chart.container('container');

      // initiate chart drawing

      chart.draw();

    }

  );

});