Pyramid chart on Glide
please, a need create a pyramid chart, with defined status, and i need declare some color for each status, i looked for the quick chart, but i doesn’t finded this model for chart, please someone can help me to implement this chart?
Do you have a mockup of what it should look like?
I suspect that might be possible using Quickchart.
Did you try asking in the Quickchart Community? Ian (the creator of quickchart) is active in the Community, and is usually very responsive and helpful.
If it turns out that it can’t be done with quickchart, I’d look around for other JS based charting services. There is probably one out there that can do it.
If all else fails, Cloudinary might be an option. Although that would be quite a challenge.
I looked at the chart options in quickchart and there is no pyramid type, nor in chatgpt would I like a simple option for this, maybe if I need specific support, it deviates from the simplicity I need now 
I gave it a go
<!DOCTYPE html>
<html>
<head>
<title>Inverted Pyramid</title>
</head>
<body>
<div style="width: 100%; text-align: center;">
<div style="display: inline-block; background-color: #ccccff; width: 90%; height: 20px; margin: 0;">
<span style="font-weight: bold; color: white; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;">987</span>
</div><br>
<div style="display: inline-block; background-color: #6495ed; width: 80%; height: 20px; margin: 0;">
<span style="font-weight: bold; color: white; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;">834</span>
</div><br>
<div style="display: inline-block; background-color: #9fe2bf; width: 70%; height: 20px; margin: 0;">
<span style="font-weight: bold; color: white; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;">789</span>
</div><br>
<div style="display: inline-block; background-color: #40e0d0; width: 60%; height: 20px; margin: 0;">
<span style="font-weight: bold; color: white; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;">456</span>
</div><br>
<div style="display: inline-block; background-color: #D85722; width: 50%; height: 20px; margin: 0;">
<span style="font-weight: bold; color: white; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;">390</span>
</div><br>
<div style="display: inline-block; background-color: #ffcc00; width: 40%; height: 20px; margin: 0;">
<span style="font-weight: bold; color: white; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;">267</span>
</div><br>
<div style="display: inline-block; background-color: #ff6700; width: 30%; height: 20px; margin: 0;">
<span style="font-weight: bold; color: white; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;">123</span>
</div><br>
<div style="display: inline-block; background-color: #b5651d; width: 20%; height: 20px; margin: 0;">
<span style="font-weight: bold; color: white; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;">96</span>
</div><br>
<div style="display: inline-block; background-color: #4cbb17; width: 10%; height: 20px; margin: 0;">
<span style="font-weight: bold; color: white; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;">69</span>
</div><br>
<div style="display: inline-block; background-color: #40e0d0; width: 5%; height: 20px; margin: 0;">
<span style="font-weight: bold; color: white; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;">21</span>
</div><br>
</div>
</body>
</html>
thats looks good, do you have link to live editor to me can study yout example? Maybe i can use your suggest
thanks! I put the code in the summary below the picture. just create a template for the background-colors and numbers
do you created a html code with css inline, but in my case, i want use quickchart because my other chart is made in the quickchart, i can replicate this html on quickchart? I think if i can use a pyramid like a background image and put on that image dynamic data from sheets, maybe works for me, i guess, maybe
Do you need to control the colors or it can follow a theme?
Here is another option:
Use a template column to generate a snippet that can be used in Rich text component. In this example we have 5 steps. Replace {Value1000} , {Width1000} , {Value800} , {Width800} , etc., with the actual values or column names that hold the values for each step of the chart. The widths should be percentages representing the relative size of each step compared to the base.
<div style=“width: 100%; text-align: center; position: relative;”>
<div style=“background-color: #8e44ad; height: 30px; width: {Width1000}; margin: 0 auto; line-height: 30px;”>{Value1000}</div>
<div style=“background-color: #3498db; height: 30px; width: {Width800}; margin: 0 auto; line-height: 30px;”>{Value800}</div>
<div style=“background-color: #2ecc71; height: 30px; width: {Width500}; margin: 0 auto; line-height: 30px;”>{Value500}</div>
<div style=“background-color: #f1c40f; height: 30px; width: {Width250}; margin: 0 auto; line-height: 30px;”>{Value250}</div>
<div style=“position: relative; width: {Width100}; margin: 0 auto; height: 30px;”>
<div style=“width: 0; height: 0; border-left: 15px solid transparent; border-right: 15px solid transparent; border-top: 30px solid #e67e22; position: absolute; left: 50%; transform: translateX(-50%); bottom: 0;”></div>
<div style=“position: absolute; width: 100%; left: 50%; transform: translateX(-50%); bottom: 30px; color: black; font-size: 12px;”>{Value100}</div>
</div>
</div>
Right, based on your answer I can create an HTML code with css-inline and apply it to the glide richt text component, this gives me new questions like. Can I create the code outside of glide, in this case in vscode and once created, replicate it in glide and still have dynamic data being shown? I started studying glide 3 weeks ago at the same time that I developed a CRM for my work, and as Brazil doesn’t have good and updated glide courses I reached a point where this forum has been my best glide school
With a template column, you can replace any values you want, whether that’s width, value, or even color. It might require some minor modification of the HTML that you are bringing in, but the replacement values will be the part that’s dynamic.
CanvasJS does support this, I’m pretty sure it would work with Github + Experimental Code column + web embed (paid component).
I finally managed to create a funnel with html and css, now I need to transform this into a template to inject dynamic data, now I have another huge problem for me, counting the number of times a “word” is repeated, each repetition, is once this word that represents an action was executed, create a column for each action, which represents the amount that it was executed to be able to use it in the template and have my dynamic data, and I have no idea how to do this
Can you show us the data structure you currently have?
in this column, each word represents an action that has occurred, if some word repeats, this action occurred more times, if some word appears in this column three times, three times of the action represented by the word occurred, each word represents some step on the funnel, and I need to count each time each action occurred to put on a template to show the funnel with this values
Initial thought is to take the string containing all the words then use a template column to replace the word you wish to analyze with a specific text like 
word. This will insert the emoji infront of each word. You can then use a split text column with a field used to separate elements in the resulting array. Finally you can count the incidence using the array length column.
I’m sure someone better than me knows a simpler way to work with arrays but this should work.
Update: go with Daren’s approach above 
That works, I guess I did this before in another case, but, how do I specify the quantity of some action I want to put on ${quantidade} that is going to receive some quantity when some action is executed, in the template to make dynamic data? In the template, we change a specified word for some column we want to use, in this case, how do I make this work? I need to specify eight quantities of actions that are different
