Ignition Exchange Ribbon Chart issue

Any progress made gets deleted any time I save the project and close the window and come back to it. It reloads the originally data. Any fix besides disabling the script behind the exampleData property.

What is a '-Status/Ribbon Chart'? It's not listed in the Perspective Components pallette in Version 8.1.25. When you say 'data' do you mean props configuration?

It is the template provided by Ignition Exchange -Ignition Exchange | Inductive Automation

@bmusson is apparently the author, he may be able to provide more information.

There does appear to be a bug in the property change script on Template.view.params.exampleData; replacing the script with this one should fix your issue.

#	if (previousValue is None) or (currentValue.value is True):
	if (currentValue.value is True):
		exampleData = [
			"events": [
				"mode": "CIP",
				"start": 1569000471549,
				"end": 1569549471549
				"mode": "Production",
				"start": 1570000471549,
				"end": 1570149471549
			"name": "Machine 1"
			"events": [
				"mode": "CIP",
				"start": 1570000471549,
				"end": 1571549471549
				"mode": "Production",
				"start": 1568700471549,
				"end": 1569800471549
				"mode": "Specified Color Code",
				"start": 1568000471549,
				"end": 1568679471549
			"name": "Machine 2"
		exampleModes = [
			"name": "Production"
			"name": "CIP"
			"name": "Specified Color Code",
			"color": "#31a131"
		exampleRange = {
		  "end": 1571149471549,
		  "start": 1567149471549
		self.params.data = exampleData
		self.params.modes = exampleModes
		self.params.range = exampleRange

I'll also update the version on the exchange to include this change.


The script provided above helps to retain the props.datasources but the values under Template.view.params.data , Template.view.params.modes and Template.view.params.range is getting wiped off if I am restarting the project. Is it because of some other script or am I missing something ?

Hoping someone can help,

I am having trouble trying to set the Ribbon Chart up. I have managed to get a dataset which populates correctly in the data section, I have added all the different modes and time range I am looking at.

However, the Ribbon Chart only displays one color, even though the data is showing 44 events.

It also appears that it is not using the full time range inputted.

Any help regarding this would be appreciated.

The code i am using to convert the dataset into the correct structure (thanks to @drojas)

def transform(self, value, quality, timestamp):
	data = value
	start = system.date.addHours(system.date.now(), -24)
	prevmode = -1
	prevstart = 0
	events = []
	modes = {0:"Shutdown", 1:"ProductionPreparation", 2:"Production", 3:"ProductionFlush", 4:"ProductionShutdownPreparation", 5:"CIPPreparation", 6:"CIP", 7:"CIPShutdownPreparation", 8:"Fault" }
	for row in range(data.getRowCount()):
		mode = data.getValueAt(row,1)
		time = system.date.toMillis(data.getValueAt(row,0))
		if row == 0:
			prevmode = mode
			prevstart = system.date.toMillis(start)
		if row > 0:
			if mode <> prevmode:
					"mode": modes[prevmode],
					"start": prevstart,
					"end": time,
				prevmode = mode
				prevstart = time
	data = ([
		{"name": "ROPlant",
		"events": events
	return data


@richard_hamilton , it has been a while since I played with the ribbon chart. I don't know what version of Ignition you are on, but there was one time I had to divide ALL times by 1000 for the chart to work...then, in a later version it stopped working again, I removed the divide by 1000 and it worked again. I'll open up the project and check out some of the data format and other code.

@richard_hamilton , why does the Shutdown event 2 have the same end time as Production event 1 end time? Is your query to return all the events mutually exclusive (you can't be in more than 1 state at a time)? Since the start and end of Event 2 is the same, it may not even show up on the chart anyways, but this could cause performance issues if you have a lot of events that have the same start/end times.

Actually, you may need to look at your Event 0 start and end time. Does the start of Event 0 equal the range start time? An easy fix to this is to look at how you are getting your events. If using system.tag.queryTagHistory(), be sure to add the includeBoundingValues=True parameter. Maybe also the noInterpolation=True parameter.

Try deleting Event 0 and see if the chart shows all the events.

1 Like

Hi @drojas, thank you for your reply, Yes it appears the problem lies with Event 0.
I am using a bind with tag history (as below)

This brings back a dataset

I then have the script transform you posted which I have altered the modes to fit mine,

This morning it is returning 3 events

As you mentioned the start time of event 0 is after the end time, if I delete event 0 the graph shows the other 2 events correctly, however, for some reason it is not picking up the 4th event which should start with the end time of event 2 and the end time should be the current time.

If I make Prevent Interpolation true the dataset returns three events instead of 4. It does not return event 0 and even though the third event, Production, which is in the dataset, it does not display it.

Could I be right in that it isn't displaying because it does not have an end time?

If you have the time and notice anything It would be greatly appreciated.


Hi @drojas,

Literally after I posted my reply, I noticed the start times of the tag history binding and the start time in the script where different :person_facepalming:

I changed the start time in the script to the same as the tag binding and the chart displayed the first 3 events correctly :rofl:

However, I am still missing the current event Production, which is not displaying, it is currently still in Production so does not have an end time.



It appears a weekend away from this has given me a much needed break :laughing:

I have discovered the two problems causing the issue, both to do with the start and end times.

Firstly in the post above I had two different start times, which I corrected.
Secondly I had now(0) in as the end time, when this was changed to now() then all 4 events displayed.

My only concern now is that the latest event keeps overwriting every second meaning I am unable to make a selection on this event, sometimes the event disappears for a few seconds then reappears.

The purpose of this was to allow a popup to show the information for the event selected.

Thanks for taking the time to look at this for me.

Much appreciated


@richard_hamilton, I use a page load script to set the start/end times to some custom properties which is passed on to the ribbon chart...I set the end time to system.date.now(). This prevents the constant refresh every second. You won't get true realtime display, but it keeps the ribbon chart fixed so you can interact with it. You could always add a refresh button if someone wants to quickly update the chart themselves with the latest time.

David Rojas

@drojas David thanks for your help, I tried what you suggested but for me it still updates every second :laughing:
I am also getting the most recent event dropping and disappearing every now and again, I obviously don't have the chart set up correctly somewhere :man_shrugging:

@richard_hamilton , what about the binding you had for the range start/end times used for the axis? Was that left as system.date.now()? When any of the bindings of the chart change, that causes a redraw of the chart. Screenshots help a lot...feel free to post what you have now.

@drojas , Sorry for late reply, was off for a few days. I am using a tag history binding so can't use system.date.now() int the end date box only now().

Using now() allows me to see the current step that the plant is in, if I use now(0) this prevents the current step from showing. However, if i try to view the events by expanding data.0.events it keeps closing after a second :sob: so, must be updating somewhere :rofl:

Also, on startup I get the following,

Error running Template@D$0:1/root/XYChart.onMessageReceived(self, payload): Traceback (most recent call last): File "function:onMessageReceived", line 4, in onMessageReceived File "", line 7, in load AttributeError: 'com.inductiveautomation.perspective.gateway.script' object has no attribute 'start'

I think I may not have it configured incorrectly, as when I launch the session the ribbon chart does not appear until I click where the chart should be.


The expression function now(), where the poll rate is omitted, defaults to now(1000), so it retriggers your binding every 1000 milliseconds. Use now(0) to get just the one timestamp.

Hi @pturmel, If i use now(0) then the current step is omitted from the chart, if the plant has been on production for the previous 10 hours and I use now(0) the 10 hour production step does not display.


Well, choose. You can either have a static time span, or an updating timespan. :man_shrugging:

When the timespan updates, the Ribbon ..... wait for it ..... updates.

@richard_hamilton, did you get this figured out?

@drojas no not yet, I had to pause work on it for other projects that came up. I am going on holidays for the next 3 weeks and will be picking it back up on my return.