Another post from the archives...
HTML Expressions is a feature in the Application Express reporting engine that lets you apply an HTML mask to a column value in a report. In the HTML Expression, you refer to the column value using #COLUMN_NAME#. Recently, I saw this used to create neat inline bar charts like the one below:
To create this example, I used the following query based on the Issue Tracker data model:
select pname,
cnt_issues,
ratio_to_report (cnt_issues) over () * 100 issues_chart,
round (ratio_to_report (cnt_issues) over () * 100, 1) issues_ratio
from (
select p.person_name pname, count(*) cnt_issues
from ht_issues i, ht_people p
where i.assigned_to = p.person_id
group by p.person_name
)
I then edited the column attritbues for the ISSUES_CHART column and placed the following HTML in the the HTML Expression field:
<div style="width:100px;height:14px;background:#dddddd;
border-top:1px solid #aaaaaa;border-left:1px solid #aaaaaa;
border-bottom:1px solid #ffffff;border-right:1px solid #ffffff;">
<img src="/i/1px_trans.gif" width="#ISSUES_CHART#" height="14" border="0" style="background:#3f863f;"></div>
In this HTML with CSS style declarations, the width:100px in the beginning controls the maximum length in pixels of each bar in the chart and background:#dddddd makes the background grey. The width="#ISSUES_CHART#" controls the actual length of the green part of the bar by using the value of issues_chart from the result set.