Skip to main content

%ZEN.SVGComponent.timeLine

Class %ZEN.SVGComponent.timeLine Extends svgComponent [ Deprecated, System = 3 ]

SVG TimeLine component. This displays a series of "events" along a time line.

Properties​

startTime​

Property startTime As %ZEN.Datatype.string;

Earliest displayed time (as YYYY-MM-DD HH:MM:SS).

endTime​

Property endTime As %ZEN.Datatype.string;

Latest displayed time (as YYYY-MM-DD HH:MM:SS).

birthDate​

Property birthDate As %ZEN.Datatype.string;

"Birth date" (as YYYY-MM-DD HH:MM:SS). If provided, then a time bar showing current age is also displayed.

selectedId​

Property selectedId As %ZEN.Datatype.string;

Id of selected item.

title​

Property title As %ZEN.Datatype.string;

Chart title.

dateFormat​

Property dateFormat As %ZEN.Datatype.string(MAXLEN = 3, VALUELIST = ",MDY,DMY,YMD") [ InitialExpression = "YMD" ];

Optional. Specifies the display format used for this component. (Note that the internal value of this control is always YYYY-MM-DD). Possible values are:

  • "YMD" - Year,Month,Day
  • "MDY" - Month,Day,Year
  • "DMY" - Day,Month,Year

spanHeight​

Property spanHeight As %ZEN.Datatype.integer [ InitialExpression = 20 ];

Height (in pixels) of a time span box on the time line.

marginLeft​

Property marginLeft As %ZEN.Datatype.integer [ InitialExpression = 20 ];

Left margin (in pixels).

marginRight​

Property marginRight As %ZEN.Datatype.integer [ InitialExpression = 20 ];

Right margin (in pixels).

ongetdata​

Property ongetdata As %ZEN.Datatype.eventHandler;

ongetdata event handler: This defines the client-side code that returns an graph of javascript objects used to provide the contents of this view.

onselect​

Property onselect As %ZEN.Datatype.eventHandler;

onselect event handler: This event handler is called when the user selects a new item within the timeline.

onrenderitem​

Property onrenderitem As %ZEN.Datatype.eventHandler;

onrenderitem event handler: This event handler is called when an event is plotted and makes it possible to plot custom content on the time line.

XDatas​

SVGStyle​

XData SVGStyle

Methods​

setTimeRange​

ClientMethod setTimeRange(startTime, endTime, reset, which) [ Language = javascript ]

Set the timeline start and end dates and update. Time values are in 'yyyy-mm-dd' format. This prevents the repaint that would happen if start and end dates are set separately. If endTime is not provided, update it to preserve the current time range using startTime as a new starting time.
If reset is true, clear the internal structures used to compute the locations of the time events.
If which is provided, it specifies whether the change is "translate" or "scale" (to make it easy to connect to a timeRange controller).

renderContents​

ClientMethod renderContents() [ Language = javascript ]

Render the inner SVG contents of this component.

renderTimeCells​

ClientMethod renderTimeCells() [ Language = javascript ]

Render the time cells on the top/bottom.

renderData​

ClientMethod renderData(dataGroup, marginTop) [ Language = javascript ]

Render the actual time line data.

renderOneItem​

ClientMethod renderOneItem(group, item, length, size) [ Language = javascript ]

Render one item on the timeline. group is the svg group to append to. length is the length (in pixels) of the time range to plot.. Return the size of the rendered item via size.

getCellInfo​

ClientMethod getCellInfo(cell, majorUnits, minorUnits, index) [ Language = javascript ]

Return information about a cell within the grid line.

getModel​

ClientMethod getModel() [ Language = javascript ]

Get the model used to drive the user portion of the time line.

setProperty​

ClientMethod setProperty(property, value, value2) [ Language = javascript ]

Set the value of a named property.

sortModel​

ClientMethod sortModel(model, range) [ Language = javascript ]

Take the user-supplied data model and sort it by time. Return a sorted and decorated model. Also find earliest and latest times and return via range object.

itemClick​

ClientMethod itemClick(evt, newId) [ Language = javascript ]

Click on item.

selectItem​

ClientMethod selectItem(newId) [ Language = javascript ]

Select an item.

computeAge​

ClientMethod computeAge(birthDate, currDate) [ Language = javascript ]

Compute the age between currDate and birthDate, return it as an object.

dragThumb​

ClientMethod dragThumb(evt) [ Language = javascript ]

Drag handler for vertical scrollbar thumb.