I need to draw horizontal timeline in my React based app for which I am using antdesign as UI library. According to docs, antdesign timeline component is great resource in this regard but unfortunately it apparently supports vertical timeline only. Before moving on to looking for some other open source horizontal timelines or coding the timeline myself, I thought to ask here if there's any way to convert that vertical timeline into horizontal timeline. Here's the code snippet that I used to do some changes to get the desired results but didn't get any success:
import { Timeline } from 'antd';
ReactDOM.render(
<Timeline>
<Timeline.Item color="green">Create a services site 2015-09-01</Timeline.Item>
<Timeline.Item color="green">Create a services site 2015-09-01</Timeline.Item>
<Timeline.Item color="red">
<p>Solve initial network problems 1</p>
<p>Solve initial network problems 2</p>
<p>Solve initial network problems 3 2015-09-01</p>
</Timeline.Item>
<Timeline.Item>
<p>Technical testing 1</p>
<p>Technical testing 2</p>
<p>Technical testing 3 2015-09-01</p>
</Timeline.Item>
</Timeline>
, mountNode);
I would use the <Steps>
component instead, which looks similar but supports vertical/horizontal.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With