nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Filter two charts dynamically when a pie slice is clicked

divyani

<p>Hi,</p>
<p> </p>
<p>I totally have three charts in my report. i am trying to filter two charts by capturing the categoryData when a pie slice is clicked in a Pie Chart. I am using the following script in the Y Series script section of the Pie chart:</p>
<p> </p>
<div>intentCategoryDataClicked = categoryData;</div>
<div>var chart = actuate.getViewer(evt.srcElement || evt.target).getCurrentPageContent().getChartByBookmark("All");</div>
<div>var filter1 = new actuate.data.Filter("NAME", "eq", categoryData);</div>
<div>chart.setFilters(filter1);</div>
<div>chart.submit();</div>
<div>var autoRenewalChart = actuate.getViewer(evt.srcElement || evt.target).getCurrentPageContent().getChartByBookmark("Auto");</div>
<div>autoRenewalChart.setFiltersfilter(filter1);</div>
<div>autoRenewalChart.submit();</div>
<div> </div>
<div>But the script execution ends wherever the first submit() is encountered. Can anyone please tell me how to solve this. I need more than two charts to be filtered dynamically on mouse click.</div>
<div> </div>
<div>Thanks in advance!</div>

Find more posts tagged with

Comments

divyani

<p>Anyone who knows, please reply.It is urgent.</p>
<p> </p>
<p>Thanks.</p>

JFreeman

<p>Edit: I had misunderstood the issue. My answer has been revised below.</p>
<p> </p>
<p>The issue is that when you call chart.submit() it reruns the rendering of the chart which means any codes after that call will not be executed. Instead, you can place the submit for the second chart into an anonymous call back function inside the first chart's submit.</p>
<p> </p>
<p>For example:</p>
<pre class="_prettyXprint _lang-js">
intentCategoryDataClicked = categoryData;
var chart = actuate.getViewer(evt.srcElement || evt.target).getCurrentPageContent().getChartByBookmark("lineChart");
var chart2 = actuate.getViewer(evt.srcElement || evt.target).getCurrentPageContent().getChartByBookmark("barChart");
var filter1 = new actuate.data.Filter("STATUS", "eq", categoryData);
chart.setFilters(filter1);
chart2.setFilters(filter1);
chart.submit(function(){
chart2.submit();
}); </pre>
<p>I have also attached a sample report for reference.</p>

divyani

<p>Thanks for your reply. To answer your questions, I am using BIRT Designer Professional 4.4.</p>
<p> </p>
<p>Filtering one chart on mouse click works fine for me also. But my requirement is to filter more than one chart. That is when we click on the pie slice, two line charts have to be filtered. I don't if it is ideally possible or not. Please help.</p>
<p> </p>
<p>And one more question i have regarding chart filtering is, chart.clearFilters("COLUMN_NAME") written in client script of the chart does not seem to work.</p>
<p> </p>
<p>Find the attached modified rptdesign for reference</p>

JFreeman

<p>Sorry, I had misunderstood what was happening with your requirements.</p>
<p>I have revised my original answer and example code/report above.</p>
<p> </p>
<p>Regarding the clear filter, in which even function in the client scripts have you added the clear filter?</p>

divyani

<p>Thank you so much!</p>
<p> </p>
<p>Regarding the clear filter, there are two charts in the report. A default filter is applied on the bar chart. When i click on a pie slice, the default filter applied has to get cleared and the filter has to be applied based on the categoryData clicked on the Pie chart. I have added it directly in the y-series script.</p>
<p> </p>
<p>Attached is a report design file which replicates the issue. </p>