I need to embed Tableau chart inside a HTML page. Then I have to capture the events when the user clicks on any data point/bubble/item on the chart. Events are working fine with Tableau line chart (http://public.tableau.com/views/WorldIndicators/GDPpercapita) but not working with any other charts(Eg: https://public.tableau.com/s/gallery/worlds-largest-stadiums )
Can anyone please help me. Is Tableau having limitation of handling events only with Line charts or we can capture events in any type of chart. I am using below methods to handle events.
function listenToMarksSelection() {
viz.addEventListener(tableau.TableauEventName.MARKS_SELECTION, onMarksSelection);
//alert("Event handling has been enabled");
}
function onMarksSelection(marksEvent) {
// alert("onMarksSelection");
return marksEvent.getMarksAsync().then(reportSelectedMarks);
On a high level, my requirement is: When I click on any data point on a chart, I just need to capture in Java Script say you have selected xyz item/data point.
I have attached the complete example.Line#7 works where an Line#8 does not work.
The event handling should work for all chart types. From what I can tell without digging too deep, the reason to this has to do with the URL used. The JS API is especially picky with Tableau Public URLs. You'll need to make sure that the URL points to the view and not the gallery. The best way to get the view URL is to navigate to the view, click on the share button, and copy the "link" url.
For this particular case, navigate to https://public.tableau.com/s/gallery/worlds-largest-stadiums, click on share and copy the "Link" url for your javascript. This should work.