asked on January 29, 2021
Hello Team,
I am building a solution using external Amchart Graph.
I would like to achieve the same click behavior you have in the built in Chart module.
Since I found a way to get the cells reference (column, row) in my external chart data set, I am trying now to visualise the details behind the data point ( similar to the details popup when you doubleclick a cell) using getCell() function.
To be more precise I would like to get the rowData array as specified in your Cell Data Objects definition:
rowData – Array of Cell Data Objects. The property is defined when the cell is double-clicked in the drill-through view. Contains the array of cells from the underlying data row. Only for CSV and JSON data sources.
Is the "rowData object" only available through the double click event? I have tried .getCell() function but it does not show the rowData object.
Thanks for your highlights on this topic, before I move forward on other alternative.
Regards.
Rudolf
⋅ February 1, 2021
Hello, Rudolf,
Thank you for reaching out to us.
We would like to kindly explain that the rowData property is available only through the celldoubleclick event.
However, there is an alternative solution for getting the data behind the data point:
Our team kindly suggests using the recordId property of the Cell Data Object.
The getCell() API call shows the recordId property. This way it is possible to retrieve the ids of the records that were used to compose the cell. Using the ids, it is possible the retrieve the necessary data for visualizing the details behind the data point.
For recordId to return the record ids, please complete the following steps:
"id") to your data representing each data record's id:
[
{
"id": 1,
"Color": "green",
"M": "September",
"W": "Wed",
"Country": "Canada",
"State": "Ontario",
"City": "Toronto",
"Price": 174,
"Quantity": 22
},
{
"id": 2,
"Color": "red",
"M": "March",
"W": "Mon",
"Time": "1000",
"Country": "USA",
"State": "California",
"City": "Los Angeles",
"Price": 1664,
"Quantity": 19
},
...
]
id data type for the "id" field through the mapping object:
var pivot = new Flexmonster({
container: "pivot-container",
report: {
dataSource: {
data: getData(),
mapping: {
"id": {type: "id"},
"Color": {type: "string"},
"M": {type: "string"},
"W": {type: "string"},
"Country": {type: "string"},
"State": {type: "string"},
"City": {type: "string"},
"Price": {type: "number"},
"Quantity": {type: "number"}
}
}
}
});
Here is a JSFiddle example showing how the id data type is used to retrieve the record ids: https://jsfiddle.net/flexmonster/gef8qjpo/.
Please let us know if this helps.
Looking forward to your reply.
Kind regards,
Vera
⋅ February 1, 2021
Hi Vera,
this is excellent, thanks for your help.
Regards. Rudolf