DateTime Picker+

Overview

DateTime Picker+ gives operators buttons or date controls for changing the PI Vision display time range.

When to use it

Use this symbol when you need to:

• Provide preset production periods such as shifts, days, or months.
• Let operators select precise start and end times without using the standard time bar.

Before you begin

• Define the time spans or PI Time expressions required by the display.
• Use a data source only when calendar buttons need multi-state status.

Add and set up the symbol

1. Select the symbol in the PI Vision symbol gallery.
2. Add the required data sources or asset context to the display.
3. Right-click the symbol and open its configuration pane.
4. Configure the minimum data, range, and display settings for a useful result.
5. Confirm that the symbol shows the expected data.

Use the symbol

Select a button or date to apply its configured time range to the display. Every symbol that follows display time refreshes to that range.

Configure the symbol

Overview and behavior

The DateTime Picker+ symbol creates configurable time-range selection buttons that instantly update the display's time range when clicked. It is ideal for dashboards where users need to jump between predefined or dynamic time periods for quick comparison.

Configure the control

Four modes are available for the DateTime Picker. Select a mode to see the settings specific to it:

1. Dynamic

Generates buttons dynamically relative to the current time. For example, with Interval set to Day, the control creates one button per day, always showing the most recent X days.

• Start: Sets the time boundary alignment for button start times. Hour aligns to the start of the current hour, Day to midnight, Month to the first of the month, and so on.
• Interval: Determines the time span each button covers. Setting this to Day creates one button per day.
• Offset: Shifts all button start times by a fixed duration. For example, set Offset to 6 hours to start each day's button at 06:00 instead of midnight.
• Group: Groups buttons under a heading derived from the selected grouping interval (for example, group daily buttons by Month).

• Include End Time: If this is toggled on, the displays end time will always use the full hour, for example, 00:00:00 for the end of a day. If disabled, the end time will be set to 23:59:59 instead.
• Navigation Buttons: Will display two navigation buttons left and right to move to the previous or next period in the list.

1. Static

Lets you build a custom list of buttons with individually configured time spans. Click Add to create a button. This mode supports mixing different time spans in a single control - for example, a Last Week button alongside a Last Month button. Each button has the following properties:

• Text: The label shown on the button.
• Start / End Time: The fixed start and end time the button applies to the display when clicked.

1. Data Source

Derives button content from the underlying data source values. Each recorded or interpolated value becomes one button: the button label is the data value, and the button's time range spans from the previous value's timestamp to this value's timestamp. For a worked example, see Create a Shift Calendar below.

The Type setting under General controls whether the buttons appear as a horizontal button list or a compact dropdown menu.

1. Calendar

Displays a calendar picker when the user clicks the control. Three sub-modes are available:

• Single: The user selects a single date. That date is applied as the display time.

• Date Range: The user selects a start and end date within the calendar.

• Start and End Time: Renders two separate controls - each with an independent date and time picker - for setting a precise start datetime and end datetime.

Create a month selector

This example creates a monthly button picker - one button per calendar month.

1. Set Time Mode to Dynamic.
2. Set Start Interval to Month.
3. Set Interval to 1 Month and Offset to 0.
4. Enable Group and set Group by to Year.

Create a day picker from 06:00 to 06:00

This example creates a day picker where each button covers 06:00 on the selected day through 05:59:59 on the following day - useful for production shifts that cross midnight.

1. Set Time Mode to Dynamic.
2. Set Start Value to Day.
3. Set Interval to 1 Day.
4. Set Offset to 6 Hours.
5. Enable Group and set Group by to Month.

Create a multi-state calendar

This example creates a day-selector calendar where each button is colored by the multi-state limits of the underlying data source - providing instant visual quality or status context for each day.

1. Set Time Mode to Data Source.
2. Set Mode to Interpolated.
3. Set Interval to 1 Day.
4. Set Sync Time to 00:00:00, Start Time to -2mo, and End Time to .
5. Set Show Property to Start Time and DateTime Format to Day of Month.
6. Enable Grouping and set Group by to Month.
7. Right-click the symbol and select Add multi-state.

Create a shift calendar

This example creates a shift selector driven by a PI Point that records shift names at the start of each shift.

1. Create a String-type PI tag that records the current shift name at the start of each shift (for example, every 8 hours). AF Analyses can generate these values automatically.
2. Drag the shift tag onto a new DateTime Picker+ symbol to create the control.
3. Set Time Mode to Data Source.
4. Set Data Retrieval Mode to Recorded and configure the Start and End Time as needed.
5. Set Show Property to Value.
6. Enable Grouping and set Group by to Day.

Troubleshooting and limitations

• Check: If the range is unexpected, verify the start, end, duration, offset, and local time-zone assumptions.
• Check: Changing this control affects the shared display time range.