# Perspective equipment schedule scheduledEvents style

**URL:** <https://forum.inductiveautomation.com/t/perspective-equipment-schedule-scheduledevents-style/83073>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [December 13, 2023, 9:46am UTC](https://forum.inductiveautomation.com/t/perspective-equipment-schedule-scheduledevents-style/83073 "2023-12-13T09:46:09Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Leigh.shannan](https://avatars.discourse-cdn.com/v4/letter/l/b2d939/32.png) [@Leigh.shannan](https://forum.inductiveautomation.com/u/Leigh.shannan)\
**Post date:** [December 13, 2023, 9:46am UTC](https://forum.inductiveautomation.com/t/perspective-equipment-schedule-scheduledevents-style/83073/1 "2023-12-13T09:46:09Z")

</div>

Hi, I have an equipment schedule and the scheduledEvents are bound to a SQL query. The events are showing in the schedule as expected, so I am now trying to apply some style to the events.

I have created a style class for each type of event. I assumed that the way to do it would be to add a column named 'style' which contained the path to the required style class. this didn't work. I looked in the documentation and seen that the style requires an object rather than a value.

 ![schedule style](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/2/0267a3c0e63952320dab13578c7f1655347824f4.jpeg)

I have tried a few different ways of doing this, but I can't get it working.

Can anyone point me in the right direction with this please?

Thanks,  
Leigh

---

<div class="post-metadata">

**Author:** ![calimero100582](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/calimero100582/32/18630_2.png) [@calimero100582](https://forum.inductiveautomation.com/u/calimero100582)\
**Post date:** [December 13, 2023, 2:33pm UTC](https://forum.inductiveautomation.com/t/perspective-equipment-schedule-scheduledevents-style/83073/2 "2023-12-13T14:33:58Z")

</div>

How did you wrote it?

Never tried, but based on component style, I would say:

```auto
style = { 'classes': 'yourClass' }

```

---

<div class="post-metadata">

**Author:** ![Leigh.shannan](https://avatars.discourse-cdn.com/v4/letter/l/b2d939/32.png) [@Leigh.shannan](https://forum.inductiveautomation.com/u/Leigh.shannan)\
**Post date:** [December 13, 2023, 3:25pm UTC](https://forum.inductiveautomation.com/t/perspective-equipment-schedule-scheduledevents-style/83073/3 "2023-12-13T15:25:47Z")

</div>

Thanks for your reply calimero.

I am running a select query in a script off a button. The query returns the following dataset which is saved to a custom session property, which in turn is bound to the scheduledEvents of the equipment schedule.

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/2/8/28160d5d62ff25a5a6fc7f3430894eb9c4503a2a.png)

I've tried different variations of the text returned in the style column, but none of them work. I get the following error:

```auto
15:30:10.537 [Browser Thread: e3dbea70-bdc3-4484-8643-fed213210794] ERROR Perspective.Designer.Workspace - level: LEVEL_ERROR
message: "TypeError: Failed to set an indexed property on \'CSSStyleDeclaration\': Indexed property setter is not supported."
line_number: 125
source: "http://pappapp046-08gb:8088/res/perspective/js/react-dom-16.14.0.js" 

```

Not sure what to try next. I think I have seen something about transforms, but I've never used this before so not sure how that would work either.

---

<div class="post-metadata">

**Author:** ![calimero100582](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/calimero100582/32/18630_2.png) [@calimero100582](https://forum.inductiveautomation.com/u/calimero100582)\
**Post date:** [December 13, 2023, 4:01pm UTC](https://forum.inductiveautomation.com/t/perspective-equipment-schedule-scheduledevents-style/83073/4 "2023-12-13T16:01:12Z")

</div>

You are already in style column, so remove "style = " from the value  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/b/9/b9d3ae284c0c243d679392cfebb9a0ecfd619d24.png)

---

<div class="post-metadata">

**Author:** ![Leigh.shannan](https://avatars.discourse-cdn.com/v4/letter/l/b2d939/32.png) [@Leigh.shannan](https://forum.inductiveautomation.com/u/Leigh.shannan)\
**Post date:** [December 14, 2023, 8:04am UTC](https://forum.inductiveautomation.com/t/perspective-equipment-schedule-scheduledevents-style/83073/5 "2023-12-14T08:04:03Z")

</div>

I've tried a few different variations, with braces, without, different quotes. None seem to work.

![style attempts](https://us1.discourse-cdn.com/inductiveautomation/original/3X/f/8/f813d696bc9197d5502386e528ffbbd015588a38.png)

I think today, I will remove the style column and have a go at a script transform.

---

<div class="post-metadata">

**Author:** ![Leigh.shannan](https://avatars.discourse-cdn.com/v4/letter/l/b2d939/32.png) [@Leigh.shannan](https://forum.inductiveautomation.com/u/Leigh.shannan)\
**Post date:** [December 14, 2023, 9:35am UTC](https://forum.inductiveautomation.com/t/perspective-equipment-schedule-scheduledevents-style/83073/6 "2023-12-14T09:35:25Z")

</div>

Got it done with a script transform. Changing the dataset to json format and adding style based on the value of the label.

```auto
def transform(self, value, quality, timestamp):
	#set styles
	daysStyle = {"classes":"calendarEventStyles/dayShift"}
	holidayStyle = {"classes":"calendarEventStyles/holiday"}
	berStyle = {"classes":"calendarEventStyles/bereavement"}
	dbStyle = {"classes":"calendarEventStyles/darkBlue"}
	lbStyle = {"classes":"calendarEventStyles/lightBlue"}
	offWithPayStyle = {"classes":"calendarEventStyles/offWithPay"}
	trainingStyle = {"classes":"calendarEventStyles/training"}
	yellowStyle = {"classes":"calendarEventStyles/yellow"}
	defaultStyle = {"classes":"calendarEventStyles/default"}
	
	# create empty json
	outputJson = []
	
	# loop through dataset rows
	for row in range(value.getRowCount()):
		# define object
		rowObject = {}
		rowStyle = {}
		
		# loop through columns and add to rowObject
		for col in range(value.getColumnCount()):
			colName = value.getColumnName(col)
			colVal = value.getValueAt(row,col)
			rowObject[colName] = colVal
			
			#check value in label column and use it to set style
			if value.getColumnName(col) == 'label':
				if value.getValueAt(row,col) in ("H4","H6","H8","H12","BH"):
					rowStyle = holidayStyle
				elif value.getValueAt(row,col) in ("SC(12-18)","SC(14-18)","SC(14-22)","SC(6-18)"):
					rowStyle = yellowStyle
				elif value.getValueAt(row,col) in ("SC(18-6)","SC(22-2)","SC(22-6)"):
					rowStyle = dbStyle
				elif value.getValueAt(row,col) in ("SC(6-14)","SC(6-12)","SC(6-10)"):
					rowStyle = lbStyle
				elif value.getValueAt(row,col) in ("BER"):
					rowStyle = berStyle
				elif value.getValueAt(row,col) in ("DOP"):
					rowStyle = offWithPayStyle
				elif value.getValueAt(row,col) in ("T/C"):
					rowStyle = trainingStyle
				elif value.getValueAt(row,col) in ("DAYS"):
					rowStyle = daysStyle
				else:
					rowStyle = defaultStyle
			
			# set the style
			rowObject['style'] = rowStyle
			
		#add row to json
		outputJson.append(rowObject)
	
	return outputJson

```
