Radar Chart

JorgeLopez · ‎12-27-2020

Radar Chart

Eight vertex Radar chart ready to be used.

Import it to your project and use following variables :

-LabelA - thru LabelH, to give name to each vertex

-ValueA - thru ValueH, to enter the values. Use values from 0 to 5

-FillColor - to enter the colour of the shadow zone.

For more charts, visit https://firstcodeguide.com/componentes/

StephenGW · ‎12-15-2021

@JorgeLopez

What would it take to make this a 5 vertex chart? I need one that is a pentagon but I could not figure out how to modify your to make it 5 vertex?

Thanks,

SG

JorgeLopez · ‎12-20-2021

Hello Stephen, I'm attaching to this message the pentagon radar. I hope you find it useful.

It is not possible to modify the octagon radar to convert it to a pentagon, the only way to do it is creating a new SVG image.

The good news is that it's already done.

If you are interested in how to build the SVG... let me know. I can give you some hints.

Best Regards,

Jorge

StephenGW · ‎12-21-2021

@JorgeLopez

That is perfect! I will continue to try and learn more about the SVG and if I get stuck I will reach out to you on here!

Thank you for the quick and accurate response!

JorgeLopez · ‎12-21-2021

Hello Stephen,

Pls check this last version. I added a new variable to set up the max value.

Pls let me know your comments.

Best Regards,

Jorge

StephenGW · ‎12-22-2021

@JorgeLopez

That is so close. The only problem now is there are too many layers. I need 0, 5, 10, 15, and 20 so only 5 layers where this one has 6 layers so it goes 0, 4, 8, 12, 16, and 20. Any chance one layer can be removed?

Thank you for your quick and great responses!

StephenGW · ‎12-27-2021

@JorgeLopez

On top of the request for one less layer above I also seem to be having a problem with sizing the chart. I have tried to resize it in the SVG code in the component using the height and width. I have tried resizing it in the component using the size boxes in power apps. Finally I have tried resizing it in the app when it's inserted and it always reverts back to full size when I save and re open the app. Do you have any ideas why this is happening?

Thanks

cmaugino · ‎03-31-2022

Hi Jorge,

Thanks a lot for this. It's almost what I need. I'm trying to convert the radar to a dodecagon (12 sides instead of 8). Modifying the SVG to make it 12 sided is easy-ish thanks to other sites (Coordinates of the vertices of a regular polygon with calculator (mathopenref.com)) My main challenge is now to plot the data. In your below code, how did you come up with 3.1 and 7.54?

(34.2 + (3.1 * (5 - RadarGraph.ValueA))),
"[$-es]#.##"
) & "," & Text(
(87.4 - (7.54*(5 - RadarGraph.ValueA))),
"[$-es]#.##"
)

Thanks in advance.

Chris

JorgeLopezFCG · ‎04-10-2022

Hello Chris,

I designed a guide to better understand what those numbers are. Please see attached PDF.

Also I built a 12 side version of the Radar with an improved code ( I believe it will be easier to understand).

I´m attaching both files here but they are also available in my site https://firstcodeguide.com

Please let me know your comments,

Jorge