Our pure JavaScript Scheduler component


Post by joanxtb »

We even have a screencast of it happening, but this forum wont allow .mov files to upload (for some reason)

Post by joanxtb »

Here's also a video of the test: https://youtu.be/Wf4kyn9Ft4s

Post by Maxim Gorkovsky »

I've investigated your app. It appears that scheduler problem is that it is trying to read target element height, gets 0 pixels and skips process of generating the time axis. While we are working on a solution you can try to workaround by providing height to the scheduler either by component config or element style.

With a component config it could look like:
<BryntumScheduler
        //ref={scheduler}
        mode="vertical"
        autoHeight={false}
        minHeight="20em" // or height
        resources={resources}
        rowHeight={40}
        startDate={new Date(2019, 1, 7, 8)}
        endDate={new Date(2019, 1, 7, 18)}
        eventStyle="colored"
        tickSize={80}
        barMargin={2}
      />
      
More flexible approach is to set height on the container element.
// index.css
html, body, #root {
  height: 100%;
}

// BryntumScheduler.js
return <div className={'b-react-scheduler-container'} ref={el => this.el = el} style={{flex: 1}}></div>;

// App.js
<div className="App" style={{height: '100%', display: 'flex'}}>

Post Reply