Comments (8)
Creating new items array works. Thanks.
from react-calendar-timeline.
I guess you can specify visibleTimeStart and visibleTimeEnd properties. And on date-picker change you can just overwrite visibleTime* values.
But in case you using visibleTime* properties, you would also need to specify onTimeChange method for them
from react-calendar-timeline.
Hi
I also want to use a date-picker. But when updating visibleTimeStart and visibleTimeEnd, I get the following error: "Unable to get property 'dimensions' of undefined or null reference" if the new date contains any items. Is this because the sortedDimensionItems is not updated if the items list and the groups list are unchanged?
Espen
from react-calendar-timeline.
Hi, @ekvalheim
Possible reason of this error could be mutating of timeline items array. It should be immutable value. If you're changing the items array directly, try to create new array which contains old and new items (possibly with .concat method)
from react-calendar-timeline.
Looks like this is fixed? Thank you @xmityaz for responding! :)
from react-calendar-timeline.
@ekvalheim would you be able to post some example code of how you implemented this?
from react-calendar-timeline.
@T-Hughes
jsx:
<Timeline
groups={groups}
items={items}
calendarDate={calendarDate}
visibleTimeStart = {moment(calendarDate)
.startOf('day')
.hour(8).valueOf()}
visibleTimeEnd={moment(calendarDate)
.startOf('day')
.hour(20).valueOf()}
/>
<DateTimePicker
value={calendarDate}
onChange={dateChange}
/>
In the dateChange function, the calendarDate property is updated, and the items array is populated with new data received from web api.
items: action.meetings.map((object) => ({
id: object.Id,
group: object.GroupId,
start_time: moment(object.Start),
end_time: moment(object.End),
canMove: false,
canResize: false,
className: object.FreeBusyStatus === 0 ? 'free' : 'standard',
title: object.Subject,
}))
from react-calendar-timeline.
Thanks @ekvalheim !
from react-calendar-timeline.
Related Issues (20)
- Legacy context API has been detected within a strict-mode tree. HOT 2
- Row padding
- Adding a new item already selected and resizable
- Is there any way we can make first row sticky along with header ? HOT 1
- Issue with getSumScroll Function while dragging the item using drag handle or by moving the item
- groupRenderer does not work correctly HOT 1
- Feature Request: Allow the user to replace the timeline header with a number range HOT 1
- Provide a week view to the DateHeader component with unit="primaryHeader".
- Dragging item scrolls the timeline
- Legacy context API has been detected within a strict-mode tree HOT 2
- Customizing main header - Is it possible to render day index instead of dates? HOT 1
- Can we have an array of Tittles in Items HOT 1
- Need a way to make a calendar item the full height of the row HOT 3
- Remove usage of moment library entirely HOT 2
- how can i provide minimun fixedwidth for date so that i can mention another values with date also like count for that date etc HOT 1
- Stacking only enforced when times overlap
- i want to keep unit zoom level
- Scroll Bug HOT 3
- Selecting different cells in parallel
- Drag and drop items between different timelines
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-calendar-timeline.