I’m using the following library: https://www.angular-gantt.com/.
Now on chart I see day as 24hours: 0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23
I want set timeFrame. Working day is from 6 a.m to 22 p.m. I tried set timeFramesNonWorkingMode to hidden.
What else should I change?
My config:

    $scope.options = {
      mode: 'custom',
      scale: 'hour',
      sortMode: undefined,
      sideMode: 'TreeTable',
      daily: false,
      maxHeight: false,
      width: false,
      zoom: 1,
      columns: ['model.name', 'from', 'to'],
      treeTableColumns: ['from', 'to'],
      columnsHeaders: {'model.name': 'Nazwa', 'from': 'Start', 'to': 'Koniec'},
      columnsClasses: {'model.name': 'gantt-column-name', 'from': 'gantt-column-from', 'to': 'gantt-column-to'},
      columnsFormatters: {
        'from': function (from) {
          return from !== undefined ? moment(from).format('DD.MM.YYYY HH:mm') : undefined
          // return from !== undefined ? from.format('lll') : undefined
        },
        'to': function (to) {
          return to !== undefined ? moment(to).format('DD.MM.YYYY HH:mm') : undefined
        },
      },
      treeHeaderContent: '<i class="fa fa-align-justify"></i> {{getHeader()}}',
      columnsHeaderContents: {
        'model.name': '<i class="fa fa-align-justify"></i> {{getHeader()}}',
        'from': '<i class="fa fa-calendar"></i> {{getHeader()}}',
        'to': '<i class="fa fa-calendar"></i> {{getHeader()}}',
        // 'model': '<i class="fa fa-calendar"></i> {{getHeader()}}'
      },
      autoExpand: 'none',
      taskOutOfRange: 'truncate',
      fromDate: moment(new Date()).format('YYYY-MM-DD'),
      toDate: moment().endOf('isoWeek').format('YYYY-MM-DD'),
      rowContent: '<i class="fa fa-align-justify"></i> {{row.model.name}}',
      taskContent: '<i class="fa fa-tasks"></i> {{task.model.name}}',
      allowSideResizing: true,
      labelsEnabled: true,
      currentDate: 'line',
      currentDateValue: new Date(),
      draw: false,
      readOnly: false,
      groupDisplayMode: 'group',
      filterTask: '',
      filterRow: '',
      timeFrames: {
        'day': {
          start: moment('06:00', 'HH:mm'),
          end: moment('22:00', 'HH:mm'),
          color: '#ACFFA3',
          working: true,
          default: true
        },
        'noon': {
          start: moment('22:00', 'HH:mm'),
          end: moment('06:00', 'HH:mm'),
          working: false,
          default: true
        },
        'closed': {
          working: false,
          default: true
        },
        'weekend': {
          working: false
        },
        'holiday': {
          working: false,
          color: 'red',
          classes: ['gantt-timeframe-holiday']
        }
      },
      dateFrames: {
        'weekend': {
          evaluator: function (date) {
            return date.isoWeekday() === 6 || date.isoWeekday() === 7
          },
          targets: ['weekend']
        },
        '11-november': {
          evaluator: function (date) {
            return date.month() === 10 && date.date() === 11
          },
          targets: ['holiday']
        }
      },
      timeFramesWorkingMode: 'visible',
      timeFramesNonWorkingMode: 'hidden',
      columnMagnet: '1 hour',
      timeFramesMagnet: true,
      dependencies: {
        enabled: true,
        conflictChecker: true
      },
    }

                <div ng-if="dataLoaded" gantt
                     data="data"
                     time-frames="options.timeFrames"
                     date-frames="options.dateFrames"
                     time-frames-working-mode="options.timeFramesWorkingMode"
                     time-frames-non-working-mode="options.timeFramesNonWorkingMode"
                     time-frames-magnet="options.timeFramesMagnet"
                     api="options.api"
                     column-magnet="options.columnMagnet">
                  <gantt-tree enabled="options.sideMode === 'Tree' || options.sideMode === 'TreeTable'"
                              header-content="options.treeHeaderContent"
                              keep-ancestor-on-filter-row="true">
                  </gantt-tree>
                  <gantt-table enabled="options.sideMode === 'Table' || options.sideMode === 'TreeTable'"
                               columns="options.sideMode === 'TreeTable' ? options.treeTableColumns : options.columns"
                               headers="options.columnsHeaders"
                               classes="options.columnsClasses"
                               formatters="options.columnsFormatters"
                               contents="options.columnsContents"
                               header-contents="options.columnsHeaderContents">
                  </gantt-table>
                  <gantt-corner headers-labels="options.corner.headersLabels" headers-labels-templates="options.corner.headersLabelsTemplates"></gantt-corner>
                  <gantt-groups enabled="options.groupDisplayMode === 'group' || options.groupDisplayMode === 'overview' || options.groupDisplayMode === 'promote'" display="options.groupDisplayMode"></gantt-groups>
<!--                  <gantt-tooltips></gantt-tooltips>-->
<!--                  <gantt-tooltips content="-->
<!--                  '{{task.model.name}}</br>' +'<small>' +-->
<!--                  'Start: {{task.model.fromTxt}}</br>'  +-->
<!--                  'Koniec: {{task.model.toTxt}}</br>'   +-->
<!--                  'Czas: {{task.model.durationTimeTxt}}</br>'   +-->
<!--                  '</small>'">-->
<!--                  </gantt-tooltips>-->
                  <gantt-tooltips content="
                  '{{task.model.name}}</br>' +'<small>' +
                  'Start: {{task.model.fromTxt}}</br>'  +
                  'Koniec: {{task.model.toTxt}}</br>'   +
                  '</small>'">
                  </gantt-tooltips>
                  <gantt-bounds></gantt-bounds>
                  <gantt-progress></gantt-progress>
                  <gantt-sortable></gantt-sortable>
                  <gantt-sections></gantt-sections>
                  <gantt-movable enabled="!options.readOnly"
                                 allow-moving="options.movable.allowMoving"
                                 allow-row-switching="options.movable.allowRowSwitching"
                  ></gantt-movable>
                  <gantt-draw-task
                    enabled="options.canDraw"
                    move-threshold="2"
                    task-factory="options.drawTaskFactory">
                  </gantt-draw-task>
                  <gantt-overlap></gantt-overlap>
                  <gantt-resize-sensor></gantt-resize-sensor>
                  <gantt-dependencies
                    enabled="options.dependencies.enabled"
                    conflict-checker="options.dependencies.conflictChecker"
                    read-only="options.readOnly">
                  </gantt-dependencies>
                </div>