RGraph is a JavaScript charts library based on
HTML5 SVG and canvas. RGraph is mature (over 15 years
old) and has a wealth of features making it an ideal
choice to show charts on your website.
Get the latest version of RGraph (version 6.17) from
the download page. There's also older versions available,
minified files and links to cdnjs.com hosted libraries.
Posted by Rachel at 12:31 on Monday 4th September 2023[link]
Can I create a radial chart where the user can add data interactively? In my scenario, users are rating themselves from 1-10 against 12 skills before and after they complete a project. Ideally they use a slider to add a score for each skill and it plots on a radial/radar chart in real time (see attached image). The functionality needs to be an API that I can call from my application.
Has anyone done anything like this please? Is it possible?
Attached image:
Posted by Richard at 17:02 on Monday 4th September 2023[link]
Yes you could do this with the Radar chart - albeit it won't be curvy - just angled.
I'll make you an interactive demo later today but for now, you could look at the Radar chart demos in the download archive:
The JavaScript code is actually a lot less complicated than I thought it was going to be.
There are lots of things that you could add to this (maybe you're thinking of doing this already) - two that come to mind are storing the data in the window.localData variable to make it persist across refreshes and/or adding AJAX calls to send the data back to the server.
In both cases, you'd add the relevant code to the updateRadar() function.
Posted by Rachel at 18:05 on Thursday 7th September 2023[link]
That is amazing, Richard, and thank you for taking the time to do it. I am saving the results to Zoho Creator, and the graph would be embedded into the Creator app. There might be a way to do the graph natively with Creator, though it's quite limited in the configuration options, but there is no way to do the sliders.
)