Selected Points is not populated after clicking a line chart

[victorct_69152]

• Goal: Send a user to a table containing the data of a line chart (drill down) when clicking on it.

• Steps:

1. Create a Line Chart
2. Create a Script that runs on Select and console.log the `chart.selectedPoints``
3. Selected points will print empty (or see them on state) when clicking a point on the Line Chart.

• Details:

• Using Charts V2, Line Chart.

• Data is populating from a simple SQL query.

• Screenshots:
  

  
  
  

[WidleStudioLLP]

Hello @victorct_69152, welcome to the Retool Community!

Here’s your solution: Use the onPointClick event handler. This event directly provides the data of the clicked point, making it an ideal choice for implementing drill-down actions.

[victorct_69152]

There is no such thing as onPointClick event handler in the actions dropdown

[WidleStudioLLP]

Hello @victorct_69152

Apologies for the confusion earlier regarding the onPointClick event handler. I have found that using lineChart.series works perfectly. Below is a JavaScript query that I created

let formattedData = Object.values(lineChart1.series).map((series) => {
  return series.xData.map((x, pointIndex) => ({
    dataset: series.name,
    group: series.name,
    indices: [pointIndex],
    x: x,                          
    y: series.yData[pointIndex],  
    value: series.yData[pointIndex] 
  }));
}).flat();

return formattedData;

This query, when triggered in the line chart event handler, works as expected and produces the desired result.

Thank You.

[Tess]

Hi there,

I will report this bug to our team for a fix

In case it relates to this use case, I wanted to add that we also have a feature request on file to add a utility function for setting selected points