OCS360 doesn’t just collect your machine data—it helps you visualize it in a way that makes sense for your operations. In this session, we’ll guide you through creating custom dashboards that bring your data to life. You’ll learn how to choose the right widgets, organise layouts, and configure real-time updates so your team can monitor performance at a glance. Whether you’re building your first dashboard or looking to refine your existing ones, this webinar will help you turn raw data into actionable insights with OCS360.

 




0:16

Hello and welcome to today’s webinar.
0:21

Today we will look at dashboard development in OCS 360. Let’s take a look at our agenda for today.
0:30

We are going to start with a quick review of OCS 360 and then we are going to explain what are dashboards and what are widgets and then there will be demonstrations throughout and we will finish with a Q &A session.
0:46

Let’s review OCS360.
0:49

So OCS360 is a new cloud service from Horner, making it as easy as possible to push data from Horner controllers in the field to the OCS360 cloud.
1:02

And to do that, we use a special free version of MQTT that is built into Canvas as well as Prime.
1:11

to push the data in the form of variables to OCS 360.
1:17

Once the data is up at OCS 360, there will be data recording going on in the background for up to five years, depending on the plan you choose.
1:29

You can do dashboarding, which is our topic for today.
1:33

You can do remote alarm annunciations and notifications over email and SMS text messages.
1:40

So it is a very functional service and it is going to get more functional as the time goes on.
1:46

Let’s talk about dashboards.
1:48

Dashboards are customer pages created in OCS 360 that allows customers to monitor their applications and the monitoring could be of historical data, real time data, any combination of the two.
2:04

It will be primarily data that is being pushed or published by the OCS up to the OCS 360.
2:12

A typical application is going to involve a number of dashboards and to build dashboards you use objects called widgets.
2:20

Widgets are building block objects for your dashboards and OCS 360 comes with dozens of widgets available for you to use and they are organized into what are called bundles there are bundles for charts and tables and gauges and maps and many more and when you choose a widget and place it on the dashboard typically you are going to need to tie it to data coming in from the OCS that is a typical process so how do you specify that well for your widget you are going to specify the device where the data is coming from that is typically going to be the OCS and you’re to tie it to one or more data keys or variables so that is what is involved with building dashboards selecting widgets assigning it to OCS and the data variable that you are interested in.
3:17

For our demonstration we are going to start by taking a look at what is going on in the machine side of things.
3:24

We have got a prime OCS that is simulating a machine and we have a number variables that are displaying on the screen here.
3:33

And this is the main screen and then we also have a secondary screen where we are showing off the OCS 360 status so we can keep an eye on things and make sure things are working. Let’s take a look at our program variable list.
3:49

Let’s start in our global variable group. We are going to scroll down until we get some variables here.
3:55

We have got pressure, temperature, rising level, hardener level.
4:01

This is an epoxy making machine.
4:04

It is a simulated one.
4:06

And for those four variables here, we have checked the check mark for OCS360.
4:12

So that basically adds it to our default group of published data that goes out once a minute.
4:19

And then if we go back here and close the global variable group and go into our retained variable group, you can see we also have some retained variables that are going to OCS 360 as well.
4:34

This checkbox is one of the things that makes OCS 360 really easy to use. Let’s close that down.
4:42

Now let’s take a look at our OCS 360 configuration which you can find under networking under the 360 area here and here is our default group this is where those variables just show up and are listed when we check the checkbox and then we also have a group called subscribe and we have previously named it subscribe it is a subscribe type group it’s a key thing you can name it whatever you want and this is where we added the two pieces of the two variables that ultimately are coming back the other direction as well.
5:23

The machines on boolean which gives us the ability to remotely override the machine being on and the temperature set point to another variable that we can also override automatically. That is what is going on the OCS configuration.
5:40

This is a common status set up that we have used for our demo so far with the OCS 360, so this is what’s happening on the seascape side of things.
5:51

Now if we look at our application on the bench, you can see the main screen here with an actual data filled in and we have got a jump button here to that status screen and everything looks good there.
6:04

You will notice on the right hand side we have yet to have any subscribed data.
6:10

The subscribe count is zero, so that indicates nothing is in our OCS 360 configuration online is dealing with the subscribed data.
6:20

Yes, but that is what we are going to set up as part of our dashboard demonstrations today.
6:26

Now let’s search up OCS 360, let’s go into OCS360.cloud, we are verifying we are human and we have logged in, so this is what things are looking like on our main screen.
6:39

Here are our home screen and OCS360, let’s take a look at our devices.
6:46

So we have got EpoxyMatic, which we have previously added in the last video, that is its MAC address, that is what identifies it different from any OCS.
6:57

And then if we take a look at our data, the latest elementary, here it is, so that is latest set of variables that have been effectively pushed from the OCS as a publisher to the OCS 360. So now we know we are getting good data.
7:15

We know we have got our OCS up here and online. It is active and we can start building dashboards.
7:22

Now let’s navigate to dashboards. We have not created any dashboards yet.
7:27

So that is the first thing we are going to do. It’s create a new dashboard.
7:32

We are going to do the plus button here to create a new dashboard we need to give it a name for this one let’s just call it gauges and we can put description in if you like you can also put in a background image in here let’s just hit add for now and now it is ready for us to add a new widget there are a couple different ways we can do that let’s go ahead and hit a new widget button here and then it brings up all these bundles of widgets and you can think of bundles as different classifications or groups of widgets. Let’s go ahead and add a gauge. Let’s go ahead and add this one.
8:13

Let’s say it is called a speed gauge. Let’s add that one.
8:18

The first thing it is going to ask us is to tie it to a device. So let’s click here.
8:23

The Epoxymatic is the only device in our system currently and then most widgets have a default data key setting here.
8:32

So the first thing you are going to do is delete that default data key and add one of our actual variables that are being pushed to OCS 360 instead.
8:42

So let’s say that we are going to do pressure here and we can give it a gauge title.
8:48

Let’s give it a title, let’s call this pressure under units.
8:52

We are going to match what makes sense.
8:55

and instead of hunting through the list we are going to start by typing in what we are looking for and it will show up right here so that is the basics of how it looks we are going to hit add now it is important that we hit save let’s add one more gauge and we will do that by going into edit mode first and then adding a widget now when we first added the dashboard we were automatically in edit mode, so we are going to add a different type of gauge.
9:27

This one again tied to the same device, poximatic, getting rid of the default data key, adding one coming from our machine, which is what we want, temperature as the title.
9:41

Lets go ahead and leave things alone for now and see how the default looks.
9:45

We need to clean up our range because it is showing us in red.
9:50

Let’s go ahead and go back in and edit the widget and this time we are going to go from 0 to 100, the only thing that we may need to clean up now is the colours, pretty alarming but it looks good for now.
10:04

Now the other thing we will probably want to do if we want to clean this appearance is we will probably want to change our range so that these numbers come out even, so let’s go ahead and do that.
10:18

Lets go ahead into edit mode and on the range lets go up to 110, thats our preview lets go back and change this lets say to 120 so we have now set our range so that we are getting nice even numbers on our tick marks here and the only thing left to do would be to clean up the shading here so we will apply that and then lets go ahead and clean up the scale So if we click under scale colours, lets get rid of all the scale colours and lets say anything from 50 to 70 is blue, lets just simplify this thing down to where red is everything from 90 to 120 and we can always make sure that we are done, we hit save.
11:06

Lets create another dashboard, lets hit add dashboard, we are going to call this process history we could put in a description here.
11:16

It moves us to the screen and then we can hit this add new widget button. Let’s go ahead and add a time series chart.
11:25

We are going to select time series line chart.
11:29

We’re going to use an advanced one because there are some extra options that you need to see that are pretty important.
11:37

We are also going to select use widget time window so we can customize this time window the way we want.
11:46

So select our device, which in this case is our OCS360, get rid of default data and put hours in.
11:54

We are going to put in the temperature, the temperature set point and the pressure.
11:59

So now let’s go to the widget card and we are going to enable widget data export.
12:05

It is at the bottom of the widget card here and we are going to do this so we have the ability to click a button on this chart when we are done any time we want and you will download csv file which is a spreadsheet style file with our historical data in it so it is another way that we can look at the data quickly and easily we are done with the widget carry let’s go back to the data and scroll up now we want to go in and change our time window instead of looking at the times worth of data let’s look at the last days worth of data we will leave everything else the same hit update and let’s see how things look once we hit add we are going to make it larger we can make it whatever size we want and as you can see we are starting to get data so data is coming in and then we have got the latest data showing here let’s go ahead and make sure we hit save so this is real time data from the last day, as time goes on we are going to see more real data looking here.
13:15

Next lets take a look at creating another dashboard, this one we want to use to display tank level, so we are going to call this one tank, we are going to go ahead and go to the liquid level here, pick a cylindrical style tank, select our device, get rid of the default data key, add our rise in level, change the title to rise in level, we are going to leave everything else the same because our source unit are present.
13:46

One thing we are going to change is under the liquid color, lets click on this here and we are going to make this a constant.
13:55

So the liquid is always the same color regardless of its high, medium or low.
14:01

You could choose and we will adjust the size here and we are going to do another quick one where the only real difference is a different variable and a different color.
14:12

So let’s add another widget.
14:14

Let’s go to our liquid levels, select our vertical cylindrical tank, select our device, get rid of the default and put our hardener level in which is the variable we want.
14:26

change its title to match what we want and now we are going to go down to the liquid color change it to a constant and we selected a different color hit the select button hit apply button hit the add button and now we are going to move it to where we want and size it the way we want it to be sized approximately let’s not forget to save before we leave and the last thing we’re going to show you is the Google Maps widget.
14:56

Now the Google Maps widget actually depends on the latitude and longitude attributes that are not there by default so let’s navigate our device list here. We are clicking on our device that we want to show on Google Maps.
15:11

We are going to go to the attributes and we are going to switch from Client Attributes to server attributes and we need to add latitude and longitude attributes to our list of attributes here so we’re going to hit the plus button type in latitude and this is going to be a value type of double position and then we need to paste in the latitude you can copy and paste any latitude you want now we need to simulate add the longitude so now we have added latitude and longitude as attributes let’s get out of here and now let’s go back to the dashboard let’s add a new dashboard and we are going to call it a sitemap we will add a new widget let’s go to our maps area and we are going to select google maps we want to select epoxymatic which is our device and then under data keys we want latitude and longitude and hit add it is the location we hit save and it should be filling with more detailed information soon.
16:15

This is a road map which is not the one we need so lets go back into edit mode and find a different appearance.
16:24

So instead of road map lets go with the satellite map.
16:28

Now we are getting a satellite view of the map, we can zoom in and zoom out as we choose and again lets not forget to save.
16:37

The last thing we are going to look at is how to use control widgets that can send data back to the OCS for things like override as well as set point changes and those sort of things.
16:49

First go back to the dashboards instead of creating a new dashboard this time we are going to go ahead and add these control objects to an existing dashboard.
17:01

Let’s do the gauges one and we are going to go into edit mode And we are going to add a widget and this time we are going to select the bundle of control widgets and let’s select a round one.
17:14

Our target device is the OCS which is called EpoxyMATO.
17:19

Let’s go to the appearance tab down here.
17:22

This is the list of available subscribed tags.
17:25

There are ones that are in the subscribed group of the OCS and the one we want is the machine on.
17:31

And we are going to make the title of the switch machine on.
17:35

we will just hit add and it is by default it is small we want to make it bigger than that let’s make it larger and we have a machine on control now we should be able to use it to turn the machine on and off so let’s take a look at our bench you can see we are getting subscribed data we have a subscription count here and the reason it is not zero but it is 13 is because we’ve been doing some tests but you can see that our machine is on down here, the green button is on.
18:08

Now if we go back to our computer and hit off and immediately go to the OCS, it is that fast, that was an on and off object control, lets go ahead and turn it back on, we are ready on.
18:22

Now lets add one more control object here, we are going to go back into edit mode, add widget back to the control widgets bundle and this time we are going to select a **** control our target device is our epoxy matter go under appearance go under here to the list of subscribed tags we want our 10% point set our initial value which we are going to set it to something that makes sense to our machine and 0 to 150 we have changed that we do not the title to be **** control let’s make the title temp set point and let’s see how that does by default let’s move it to the middle and make it a little bit large and if we hit save we can modify the set point so we have made it to 48 let’s check on our unit our temperature point has changed down 48. Just go back here, change it back up and verify that has been taken already.
19:29

That concludes our webinar for today.
19:32

Thank you so much for listening and the Q &A session will begin shortly.
20:35

I’m getting that there’s no audio.
20:39

Can someone just comment now that they can hear me if possible please okay anybody else have we got audio okay perfect thank you I’m not sure what what was missed so I’ll just go back to the start of what I started after the webinar and if you heard it already you might just have to hear it again so we are going to continue with the OCS 360 videos next good alarming and notifications.
21:35

As usual the registration link is already up so I would suggest getting in for that and keeping going with these 360 videos.
21:43

Just on the map that we have to say that is for development purposes only just to make you aware.
22:01

What else have in with more questions or can’t think of them on the spot right now, feel free to contact us at TechSport and we shall help you there with whatever you have.
22:16

Okay, I’m not seeing any any other questions on that, apologies about the audio issues there.
22:23

Yep, but feel free to to get back to us on TechSport and we’ll go through whatever you need.