Consider the following example from the Oracle JET Cookbook: https://www.oracle.com/webfolder/technetwork/jet/jetCookbook.html?component=timeline&demo=dateFormatsTimeline
It showcases various datetime formats for giving begin/end datetimes for timeline events.
If I adopt the example in the following way in Visual Builder:
- Test Page containing only the <oj-timeline>…</oj-timeline> tag
- Simplify: <oj-timeline-item start/end="[[item.data.begin/finish]]"
- Replace: <oj-timeline data="[[$variables.dataProvider]]"
- Define variable “data: Array<Object>” with default value set to the contents of seriesData.json of the cookbook example
- Define variable “dataProvider: ArrayDataProvider<any>”, bind data to variable “data”
Opening the preview of this page, the timeline chart renders successfully.
However, all the timeline items are placed incorrectly, they are position on the previous day instead of the one specified.
This includes the events where a UTC timestamp is provided specifically.
The results look as follows.
{
"id": "e1",
"title": "ISO Format",
"begin": "2013-02-04T15:20:00-07:00",
"finish": "2013-02-10T15:20:00-07:00",
"description": "Used ISO date and time format with zoning.",
"series": "Oracle Events"
},
{
"id": "e2",
"title": "ISO Format with default UTC Time.",
"begin": "2013-02-11T15:20:00Z",
"finish": "2013-02-17T15:23:00Z",
"description": "If the value in the finish of format is omitted, UTC time is used.",
"series": "Oracle Events"
},
{
"id": "e3",
"title": "ISO Format in Short Notation",
"begin": "2013-03",
"finish": "2013-03-10",
"description": "In the short notation day and time can be omitted",
"series": "Oracle Events"
},
{
"id": "e4",
"title": "Non ISO Format",
"begin": "03/07/2013",
"finish": "Mar 17, 2013",
"description": "Allowed 'MM/DD/YYYY' and 'mmm DD, YYYY' notations",
"series": "Oracle Events"
},
Note that depending on the format chosen (ISO or UTC), the tooltip may show the correct start and end date, however the placement on the x-axis is still wrong.
How can I get these timeline events to be rendered in the correct/expected position?