Unanswered

I need to create a Gauge Chart into PowerApps application

(0) Share

Report

Posted on by Raj2014

I need to create Gauge Chart with the 3 value
Red,Amber,Green
Data are coming from the data source

In the above image DE Outcome coming as red
So I need to the indicator to red level

Categories:

Building Power Apps

I have the same question (0)

All responses (2)

Answers (1)

zmansuri 6,048 Super User 2024 Season 1 on at

Like (2)

Report

PowerApps out of the box does not have guage chart.

Maybe this link will be helpful to you.
http://powerappsguide.com/blog/post/canvas-apps-how-to-access-additional-chart-types#:~:text=A%20great%20way%20to%20extend,Canviz%20Power%20Apps%20Chart%20Components.&text=It%20offers%20a%20range%20of,stick%2C%20and%20gantt%20chart%20types.

Was this reply helpful? Yes No
Verified answer

Raj2014 70 on at

Like (0)

Report

@zmansuri
I have created a Gauge chart

With(
{SVGArch: "<path d='M 0 50 A 50 50 0 0 1 100 50 L80 50 A 30 30 0 0 0 20 50' /> ",
SVGRotate:180 * Parent.Score,
RedRotate:-180 *(1-Parent.RedScore),
AmberRotate:-180 *(1-Parent.AmberScore)

},
"data&colon;image/svg+xml;utf8, " & EncodeUrl(
"<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 50'>
<g fill='Green'>" & SVGArch & "</g>
<g fill='Gold' transform='rotate("& AmberRotate &" 50 50)'>" & SVGArch & "</g>
<g fill='Red' transform='rotate("& RedRotate &" 50 50)'>" & SVGArch & "</g>
<line x1='0' y1='50' x2='100' y2='50' stroke-width='1' stroke='black'
transform='rotate("& SVGRotate &" 50 50)'
/>
</svg>"))

Was this reply helpful? Yes No