Get Free Trial
Get Free Trial

Selecting chart points

Answered
Yousif Ahmed asked on September 30, 2019

Hi Flexmonster,
We have been trying to build on flexmosnter’s built-in charts in order to give users the ability to select data points from the charts as the start point for a workflow. In order to do this we need a way of determining the row and column values for a particular chart point

At the moment we cannot find a reliable way of doing this – we have tried using the svg title element that is generated for each chart bar/point, but this is unreliable since the tooltip text is clipped and an ellipsis is added when over a certain length.

Can you suggest any way of identifying the related data values for a clicked chart element?
 
Or, alternatively, is there a way of preventing the chart element’s title text from being clipped so that we can reliably read all the dimension values?
 
Kind Regards,
 
Yousif

6 answers

Public
Ian Sadovy Flexmonster October 2, 2019

Hello Yousif,
 
Thank you for the question.
Currently, we can recommend the following options:

  1. Extend the right-click context menu for charts. Please take a look at the following sample and try the right-click on the data point: https://jsfiddle.net/flexmonster/ayrvp2sx/ In the handler, additional data about the selected point is available.
  2. Connect third-party charts to Flexmonster and use its possibilities to handle the data clicks. More details are here: https://www.flexmonster.com/doc/integration-with-highcharts/

Please let us know if it helps.
 
Regards,
Ian

Public
Yousif Ahmed October 3, 2019

Hi Ian,
 
Thank you for the suggestions, and for providing the example, but integrating with another charting library is not a realistic option for us – one of the biggest reasons we are using flexmonster rather than another pivot library is for its built in charting capability.
 
Extending the right click context menu would also not really solve the problem for us since it would require users to right click a chart point and then left click the menu item to select the chart point. Not only is this very inconsistent with cell selection on the pivot grid (which uses a left click), but also it makes it very difficult to select multiple chart elements in a user-friendly way. Users need to be able to select with a single left click as on the grid
 
What we would really need is some kind of programmatic hook that would give us access to the clicked ChartData object, for example through some kind of ‘chartclick’ event similar to the ‘cellclick’ event on the grid. There seem to be lots of events available for the grid but hardly any for charts…
 
Alternatively, if there was some way of adding some additional attribute to the rendered svg elements that would help identify the corresponding chart data, we could use that.
 
Even if there was a way to stop the chart element’s title text being truncated, this would also help us enormously.
 
Is there anything you can suggest that would achieve this? And if not, is there something you would consider including in an upcoming release that would allow us to move forward? This is really a key feature for our app and it’s fundamental to whether or not we can continue to use flexmonster going forward
 
Many thanks,
Yousif

Public
Ian Sadovy Flexmonster October 3, 2019

Hello Yousif,
 
Thank you for your answer.
Taking into consideration the importance of this feature for your project, we will add your request to the upcoming minor release.
We are going to add chartclick event (similar to cellclick). With this event, additional data will be available (similar to the data in the customizeContextMenu hook).
 
ETA for this feature is Oct 21.
 
Please let us know if it works for you.
 
Regards,
Ian
 

Public
Yousif Ahmed October 3, 2019

Hi Ian,
 
Thank you very much for the quick response – that would definitely work for us. A chart click event would be the perfect solution for us as it would give us exactly the hook we need to implement the selection functionality properly.
 
Looking forward to getting our hands on the new version!
 
Many thanks,
 
Yousif
 

Public
Yousif Ahmed October 25, 2019

Hi all,
 
Just wanted to feed back that we have now upgraded to 2.7.17 and have begun using the new chartclick event, and it’s working great. We’re now able to implement our own chart selection easily and reliably.
 
Many thanks to you all,
 
Kind Regards,
 
Yousif

Public
Vera Didenko Flexmonster October 25, 2019

Hello, Yousif,
 
Thank you for the update.
Your feedback is very important to us.
 
We are glad to hear that the new chartclick event works fine for you.
 
You are welcome to write to us in case of questions.
 
Best Regards,
Vera

Please login or Register to Submit Answer