How To Use The Sparkline Xmpro App Designer Toolbox

In this video, you’ll learn how to use the sparkline in the XMPRO App Designer.

Need help with creating your XMPRO apps? Send an email to [e-mail]

Go to https://xmpro.com if you...

Transcript

In this video, you’ll learn how to use the sparkline in the XMPRO App Designer.

Need help with creating your XMPRO apps? Send an email to [e-mail]

Go to https://xmpro.com if you... hi and welcome to another training video

from Exim Pro today we will be looking

at how to use the sparkline component as

a prerequisite you should have already

gone through the video on how to create

and use data sources if not then I

recommend doing that first the sparkline

component can be found in the basic

blocks section sparklines don't look so

good when they are extremely large so

I'm going to change the width to 50% on

this one and I to 80 pixels and I I also

have to change the Flex grow to zero so

in order for anything to appear in the

sparkline we have to assign it a data

source I've already previously created

one with a battery level over time and

you have to select the data so the

x-axis is the horizontal axis we want to

put that as time timestamp and the

y-axis is the value you're going to

represent on the graph which is battery

level and ignore empty points if you

check this it will discard any rows in

the in the data set that it gets that

have empty values so we can save that

and the default looks like this it's got

a battery level over time it's going

down and then it recharges and it goes

down again or recharges

it doesn't have to be a line it can be

an area bar spline spline area step area

step line or win-loss graph so what this

what some of these look like spline what

that does is it rounds the edges of the

line so instead of a jagged line it

start as sort of smoothes doubt step

makes it go in a horizontal and then

vertical and nothing else

area puts great underneath the line and

each of these have appearance properties

that you can assign to them so area has

highlight first and last etc bar has

some less properties when loss has some

wind color lost color etc so if we go

back to line and choose highlight first

and last point then it's going to bring

up some more options if we choose show

min and Max point it's going to choose

it's going to show some more options we

can change the line width back to two

there are a bunch of ways that you can

make this you can customize the

sparkline so here we've got some max

points which is 100% and then points

which is 0% so it's highly in

highlighting that and then we've got a

first and last point that's also being

highlighted

and there are many more ways that you

can modify the sparkline this has been

how to use the sparkline component