The date range component provides an intuitive, drag-and-drop way to select a contiguous range of time. The user is shown a timeline and can drag or stretch the selection box around on the timeline. The selected range is always a whole number of units, where the unit is determined by the current zoom level. For instance, in the screenshot the selected range is Feb 12, 2007 through Feb 20, 2007. This means from the beginning of the 12th through the end of the 20th.
Using this component is as simple as using the Start Date and End Date properties that the component provides. Typically, you'll include these dates in a dynamic SQL query binding that drives whatever you're using the date range for, such as a table or chart. For instance, your query binding might look like this:
SELECT Column1, Column2, Column3
FROM MyTable WHERE
t_stamp >= {Root Container.Date Range.startDate} AND
t_stamp <= {Root Container.Date Range.endDate}
Data Density Histogram
As an advanced optional feature, the date range can display a data density histogram inside the timeline. This is useful for historical data with gaps in it, so that the end user isn't hunting for data. (Tip: this is also great for demos, to make it easy to find historical data in a database that isn't being continously updated).
To use this feature, bind the Data Density dataset to a query that returns just the timestamps of the target table. These timestamps will be used to fill in the histogram behind the timeline. You can use the Outer Range Start Date and Outer Range End Date properties in your query to limit the overall return size for the query.
Appearance
|
Font
|
Font of text of this component
|
Foreground Color
|
The foreground color of the component.
|
Background Color
|
The background color of the component.
|
Fill Background
|
If true, the background of the date range editor portion will be drawn. If false, it will have a transparent background.
|
fillBackground
|
|
boolean
|
|
bindable
|
|
Today Color
|
The color of the "Today Arrow" indicator
|
todayIndicatorColor
|
|
Color
|
|
Editor Background
|
The background color of the textual date range editor portion of this component.
|
Box Fill
|
The fill color for the selection box.
|
Selection Highlight
|
The focus highlight color for the selection box
|
selectionHighlight
|
|
Color
|
|
expert
|
|
Track Margin
|
The amount of room on either side of the slider track. May need adjusting of default font is changed.
|
High Density Color
|
The color used to indicate high data density.
|
Date Style
|
The style to display dates in. For international support.
|
Time Style
|
The style to display times of day. For international support.
|
timeStyle
|
|
int
|
|
expert
|
|
15
|
Auto
|
16
|
12 HR
|
17
|
24 HR
|
|
|
Antialias
|
Draw with antialias on? Makes text smoother
|
Styles
|
Contains the component's styles
|
styles
|
|
Dataset
|
|
bindable | expert
|
|
Behavior
|
Startup Mode
|
Controls whether or not this date range automatically assigns itself a starting range based on the current time
|
Startup Range
|
If startup mode is Automatic, this will be the starting range of time available for selection.
|
Startup Selection
|
If startup mode is Automatic, this will be the starting selected range.
|
Max Selection
|
The maximum size of the selected date range
|
Tick Density
|
This is multiplied by the width to determine the current ideal tick unit.
|
Common
|
Name
|
The name of this component.
|
Enabled
|
If disabled, a component cannot be used.
|
Visible
|
If disabled, the component will be hidden.
|
Border
|
The border surrounding this component. NOTE that the border is unaffected by rotation.
|
Mouseover Text
|
The text that is displayed in the tooltip which pops up on mouseover of this component.
|
Cursor
|
The mouse cursor to use when hovering over this component.
|
cursorCode
|
|
int
|
|
0
|
Default
|
1
|
Crosshair
|
2
|
Text
|
3
|
Wait
|
12
|
Hand
|
13
|
Move
|
4
|
SW Resize
|
5
|
SE Resize
|
6
|
NW Resize
|
7
|
NE Resize
|
8
|
N Resize
|
9
|
S Resize
|
10
|
W Resize
|
11
|
E Resize
|
|
|
Data
|
Start Date
|
The starting date of the currently selected range.
|
End Date
|
The ending date of the currently selected range.
|
Outer Range Start
|
The starting date of the available outer range.
|
outerRangeStartDate
|
|
Date
|
|
bindable | expert
|
|
Outer Range End
|
The ending date of the available outer range.
|
outerRangeEndDate
|
|
Date
|
|
bindable | expert
|
|
Data Density
|
A dataset that is used to calculate a histogram of data density
|
Data Quality
|
The data quality code for any tag bindings on this component.
|
dataQuality
|
|
int
|
|
bindable | expert
|
|
The following event sets are fired by this component. See Component Event Handlers to learn more.
This component has no special scripting functions.
|