Vision Status Chart Tooltip Format

Hi there,

Is there a way to convert the date format of the status chart tooltip to other style such as "yyyy/MM/dd HH:mm:ss".

I found a similiar topic below and tried, but the date changes when the mouse moves along the x axis, the time range should be static during a state.
https://forum.inductiveautomation.com/t/status-chart-gettooltiptext-custom-string/17434

I can imagine two ways to go about this. Either iterate through the data to find the correct rows with the given selected date and assemble the tool tip string accordingly, or simply perform some string hocus pocus to transform the given default string into the desired format. Of the two, I imagine the latter approach would be more efficient especially if the chart ever contains a lot of data points.

Example:

#def getTooltipText(self, [...], defaultString):
	
	# Break the default string apart and extract the start date and the end date
	startingIndex = defaultString.index('(') + 1
	endingIndex = defaultString.index(')')
	datetimes = defaultString[startingIndex: endingIndex].split(',')
	startDate = system.date.parse(datetimes[0] + datetimes[1], 'MM/dd/yy HH:mm a')
	endDate = system.date.parse(datetimes[2] + datetimes[3], 'MM/dd/yy HH:mm a')
	
	# Put the string back together with the dates formatted as desired, and return it
	return '{}{}, {})'.format(defaultString[:startingIndex], system.date.format(startDate, 'yyyy/MM/dd HH:mm:ss'), system.date.format(endDate, 'yyyy/MM/dd HH:mm:ss'))

Result:

Thanks Justin. Your second way was very close to my original idea, but I later found that I couldn't extract the seconds. I want the tooltip to show the date with seconds so that it matches the data in the table shown in that picture.

Understood. Here is an example of how to implement the first suggested approach:

# def getTooltipText(self, [...], defaultString):
	
	# Convert the timestamp to a java.util.Date
	selectedDate = system.date.fromMillis(long(selectedTimeStamp * 1000))
	
	# Add 1 to the index to offset for the tStamp column
	seriesName = system.dataset.getColumnHeaders(data)[selectedStatus + 1]
	
	# Stop the effort if the date hasn't been found by the last row index
	maxRowIndex = data.rowCount - 1
	for row in xrange(data.rowCount):
		if row == maxRowIndex:
			return
		
		# Get the start date and end date for the current datapoint in the table data
		startDate = data.getValueAt(row, 0)
		endDate = data.getValueAt(row + 1, 0)

		# If the selected date is between the start and end dates,
		# ...assemble the tooltip and return it
		if startDate < selectedDate < endDate:
		 	return '{}: ({}, {})'.format(seriesName, system.date.format(startDate, 'yyyy/MM/dd HH:mm:ss'), system.date.format(endDate, 'yyyy/MM/dd HH:mm:ss'))

Result:
image

Hi Justin, this works perfectly. I also modified the seriesName according to my needs. Thanks.

1 Like