I’m building a survey app and want to include a line chart that does the following:
Plot two lines on a single chart. Each line plots a score provided by the user in the survey against the submission date of the survey
If a user clicks on a point in the line, they can see the full response from when they took their survey
Is there a plugin or workaround for this? As far as I’m able to tell, the out-of-the-box option only gives you the ability to display a single line chart that shows you the value of the point (not the rest of the record), and I haven’t been able to find any plugins with the interactive element I need.
Not sure if you’ve already found a solution so I thought I’d jump in here. I built a chart plugin that you can learn more about in this post (full disclosure, it is a paid plugin but there are interactive features like hovering, clicking, and dragging events) – so I’m sharing in the case that it might be helpful for you.
Feel free to let me know if you have any questions!
Alex
Thanks Alex! This looks great, I’ll definitely try it out. I’m essentially looking to build my chart in the format that you used for the “Accidents Over Time” chart that you made under dynamic data > line charts. Can I customize the “last clicked point” box to show more information that’s associated with the point that’s clicked even if it isn’t being used to graph the plot?
@yashvi.c.shah for sure, you can access the other series’ data for that X value as well. For instance, if you have 5 series in total, and you clicked a data point associated with 2015 on the “Accidents over Time” chart, you can access the all 5 series’ values and colors for 2015.
Is there other data you’d like to access about a clicked point/bar?
Hey Alex, thanks for pointing me towards your plugin, I’ve started using it and I’m quite impressed with it so far!
Regarding the chart and the additional information I want to show, here’s an example. Suppose you’re making an app where users can log the books they’re reading via a survey. The survey has 3 questions:
Name of the book
Date they finished the book
How much they enjoyed the book (1-10)
How difficult they found the book to read (1-10)
My chart would plot 2 lines, one for reading difficulty, and one for enjoyment. I’d like them to be able to click a point on either line and it would show all 3 pieces of data related to the point (name, enjoyment, difficulty) in a box above it, similar to your accidents over time example. Is this done by building a workflow, and if so, how did you go about doing it for your example?
Hey @yashvi.c.shah – yep, you use case makes a lot of sense. For what you’re hoping to achieve, something like the following implementation should work (assuming you want to display in a popup or another group on the page):
Create the popup or group you want to display the data in. The popup/group’s Thing type should be the Thing you’re using for their survey response.
When the point is clicked, a workflow action “display data” into your popup should be created. The data you display will be a search for the survey response Thing (I’m assuming here that with filters for the Chart’s clicked point’s series name, X axis value, Y axis value that will result in the desired survey response in your database)
Inside of the popup, you should be able to add text elements that refer to fields you’re referring to (e.g. Book name, date finished book, etc)
