How to combine Repeat image with values over it in Canvas?

[GGorast (Gorast)]

Hi, I have this Code that is producing top 3 of something:

filters | esdocs index="elastalert" q="match_body.intent:\"Reconnaissance & Probing\"" fields="match_body.src_ip" | sort column="count" | ply by="match_body.src_ip" expression={rowCount | as "count"} | table showheader=false perPage=3 paginate=false font={font family="'Roboto Condensed', sans-serif" size=16 align="center" color="#FFFFFF" weight="300" underline=false italic=false} | render css=".canvas__datatable { overflow: hidden; }"

Now I want that to have background for all separate rows (the bars on the left).
I can do it manually and set one on the top of the other but the problem is that sometimes there is top 2 and sometime even only 1 value and I will get empty bars.

My question is can I combine repeat image to show the code above?

tnx

[rashid (Rashid Khan)]

It looks like you have plain blue bars there, so you could just use css to create a background on the table rows:

demodata
| columns include="username,price"
| head {math "random(1,5)"}
| table showHeader=false
| render css="tr {
 background: #ADB6FF;
 border-bottom: 1px solid #fff; 
}"

[GGorast (Gorast)]

Truly awesome!
Where can I actually learn this? All this commands, strings and practical examples and videos?

Thanks!

[rashid (Rashid Khan)]

canvas.elastic.co has a bunch of videos, tutorials, reference docs and blogs, though we still have a lot of content to create.