Seal Report Forum
»
Report Edition
»
Reports
»
How do I place the Chart to the right of the table?
Rank: Member
Groups: Registered
Joined: 4/17/2017(UTC) Posts: 12  Thanks: 6 times
|
Hi all,
Even if I know how to do some CSS to fix text, fonts, colors and other layout-stuff[img]null[/img] (made the tables quite more presentable), I'm struggling to get the chart to be left to the corresponding table. Anyone that could be helpful to give me the correct settings to achieve this?
Thx,
Stigh - Norway
|
|
|
|
|
|
Rank: Administration
Groups: Administrators
Joined: 12/20/2013(UTC) Posts: 1,209  Thanks: 14 times
Was thanked: 206 time(s) in 199 post(s)
|
Yes, you can really achieve this using the CSS stuff, but in the standard HTML View template, the Chart <div> is inserted before the table <div>, so you have to edit it... For a basic report, here is the procedure: - In the tree view, select your Model HTML View, then F8 to edit the CSS parameters
- Select Chart Container CSS, then add display:inline;float:left;
- Select Data Table Container CSS, then set it to display:inline;float:left;
Finally edit your template: set [Use custom template] to true, then edit the template text move the block: Code: @if (page.DataTable != null && page.DataTable.Lines.Count > 0 && page.DataTable.Lines[0].Length > 0 && View.GetBoolValue("show_data_tables"))
{
....
}
before the block: Code: @if (ReportModel.HasSerie && View.GetBoolValue("show_charts"))
{
In this case, there is no line break after the data table...if there is enough space. The best is to play in your browser (F12) in developer mode to understand what CSS you really need. Edited by user Monday, May 1, 2017 8:11:38 AM(UTC)
| Reason: Not specified
|
 1 user thanked epf for this useful post.
|
|
|
|
Rank: Member
Groups: Registered
Joined: 4/17/2017(UTC) Posts: 12 Thanks: 6 times
|
Originally Posted by: epf  Yes, you can really achieve this using the CSS stuff, but in the standard HTML View template, the Chart <div> is inserted before the table <div>, so you have to edit it... For a basic report, here is the procedure: - In the tree view, select your Model HTML View, then F8 to edit the CSS parameters
- Select Chart Container CSS, then add display:inline;float:left;
- Select Data Table Container CSS, then set it to display:inline;float:left;
Finally edit your template: set [Use custom template] to true, then edit the template text move the block: Code: @if (page.DataTable != null && page.DataTable.Lines.Count > 0 && page.DataTable.Lines[0].Length > 0 && View.GetBoolValue("show_data_tables"))
{
....
}
before the block: Code: @if (ReportModel.HasSerie && View.GetBoolValue("show_charts"))
{
In this case, there is no line break after the data table...if there is enough space. The best is to play in your browser (F12) in developer mode to understand what CSS you really need. Thanx, worked great!
|
|
|
|
|
|
Seal Report Forum
»
Report Edition
»
Reports
»
How do I place the Chart to the right of the table?
Forum Jump
You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.
