View Trends With SPARKLINES Formula (No Packs)

Showcase Tips and Hacks
1
10 Likes
2

I like the approach @Xyzor_Max , I would have never thought about using the Rectangle function to visualize trends, thx for sharing!

1 Like
3

So cool @Xyzor_Max, thanks for sharing !

Rectangle() is one of my favorite functions

In the same idea, I’ve used it to quickly show workload of a team, including weeends

workload
workload833Ă—342 45.3 KB

Or even improved Gantt Chart with % of Progress

image
image795Ă—581 59 KB

And good old daily habits !

image
image441Ă—821 18.4 KB

But using it as kind of chart is really interesting ! thanks

3 Likes
4

HOW IT WORKS

image
image779Ă—344 38.5 KB

you start with a List() of values you want to show as a Sparkline.
the values should be be between 1 and 15. dont use zero, 1 is the smallest.
so you may need a formula to convert the original data into this range.

eg. for a set of percentages that formula would be

Percentages.Foreach(Currentvalue*14+1) // 0.00…1.00 → 1…15

so for a monochrome Sparkline (in green) using a list of values called Values you use this formula

Values.Foreach(Rectangle(5,CurrentValue,"#00FF00").Concatenate()

but if you want to have a multicolored Sparkline,
then you need 2 lists of values; one for the numbers and the other for the color of each bar
lets say those lists are DataItems and BarColors
where the colors are strings in the form “#RRGGBB” for red(RR) green(GG) and blue(BB) hex values

thus the formula for the colored Sparkline would then be

Sequence(1,Count(DataItems))                  // need an index for each pair
.Foreach(CurrentValue.Withname(N             // call the index N N=1..list size
    Rectangle(5                             // draw a rectangle of with 5 pixels
        DataItems.Nth(N),                 // height of the nth item
        BarColors.Nth(N)                // using the nth color from the list
    )
))
.Concatenate()                      // and concatenate them all into a single row

i have a senior VP client who is fond of saying

“never mind the numbers, show me the SPARKLES !”

2 Likes
5

Max, as someone who works with financial data a lot, this solution is amazing!

1 Like
6

Quentin, You and @Xyzor_Max are opening up so many possibilities for how to incorporate Edward Tufte’s “Envisioning Information” frameworks into my docs. Thank you!

2 Likes
7

Love this visualization, @Xyzor_Max! Immediately made me think of @Quentin_Morel’s inspired solution to display workload in a similar manner, but while I was still searching for the original post, he beat me to it :slight_smile:

Fully echoing @adoc_mama’s sentiment, you both contribute a new way of incorporating visualizations within Coda doc, thanks so much for sharing!

2 Likes
8

Love that you can showcase increase, decrease and no change with different colors Max, I am always surprised by your creativity :raised_hands:

Just want to share how the same looks with the Sparkline Pack, depending on the use case it may be a better option:

1 Like