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; } } }

How to place dynamic number of bar charts adjacent to one another

rupali.kundar

Hi,
 
I have a requirement, where I need to place bar charts sequentially say in a group of 3.
In advance I am not aware how many bar charts have to be shown.
Suppose if there are 8 bar charts, the first and second row should show 3 charts each, and the third row should show 2 charts.
 
I added a grouping to the table and placed a bar chart in the group footer. this displays bar chart at each row. Can some one please help me to show bar charts sequentially in a group of 3 in each row?

Find more posts tagged with

Comments

micajblock

Use a list and the Inline property. See attached. There seems to be an issue with page break so I had to make the page height large.

rupali.kundar

Thank you so much. The solution provided by you worked.

rupali.kundar

Hi,
 
Facing another issue:
If I view the "<a data-ipb='nomediaparse' href='http://developer.actuate.com/community/forum/index.php?app=core&module=attach&section=attach&attach_id=11289' title="Download attachment">3ChartsAcross.rptdesign</a>" file in the PDFformat, the charts are not displayed across, instead they are aligned one below the another.
Any idea why this happens?
 
 
Thanks.

micajblock

I think this is a known issue. Workaround might be 3 tables in a 3 column 1 row grid where each table is filtered for a 3rd of the data.

rupali.kundar

Does this mean, the list approach would not be suitable for my need. I have to place 3 identical charts, one each in the group footer of the table ?

micajblock

Not if you want PDF output.

rupali.kundar

I want it to work for all available formats. So I might have to go with the table approach.

rupali.kundar

A quick question, as there are multiple dynamic charts involved, I am placing some persistent GlobalVariables in onCreate method of the chart, which I am then accessing at the beforeDrawDataPoint method. But what I noticed was the last value stored is used for all the charts getting created. What would be the best solution to provide unique data for each chart.

micajblock

what are you putting in the global variables?

rupali.kundar

Some of the column values from the row data of the dataSet. 
e.g: reportContext.setPersistentGlobalVariable("global_variable",this.getRowData().getColumnValue("column_name"));

micajblock

Sorry, not enough details. Can you provide more details on the data?

rupali.kundar

Thanks I figured out the persistentGlobalVariable issue. 
Can you please help me out on how to provide 1/3 of the dataset to each chart, to solve my earlier issue of placing 3 charts adjacent to one another.

micajblock

See attached. I created a GroupCounter (in this case it is the same as the Group but will probably not be in your case) look at the script on the data set. Also look at the filters on tables inside the grid.

rupali.kundar

It seems the attachment is incorrect. Please attach the latest report file, where group counters and filters are implemented.

micajblock

Sorry.This should be the correct one.

rupali.kundar

That was awesome. Thank you so much..

micajblock

your welcome