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

XY Line Chart With Irregular Datetime Data?

jakoby84

Hello, 
I really hope that I don't duplicate a topic. I was searching and didn't find an appropriate solution. 
 
So I want to draw a line chart, with datetime on one axis and number of events on the other axis. The data is more complicated but can be simplified to express what I mean (originally it comes from a log database via scripted datasource) 
 
<pre class='_prettyXprint _lang-auto _linenums:0'>
DATETIME (Date) EVENT (String)
2012-12-04 11:25:13 event1
2012-12-05 08:56:10 event2
2012-12-05 09:32:54 event1
2012-12-05 10:20:01 event1
... ...
</pre>
 
What I would like to have is a line chart with n series, for event1 up to eventn. On the x axis there should be a nicely looking date/time listing with regular intervals (ideally the axis would scale based on the data provided, i.e. if the datetime range is 1-2 days, it should build aggregates for an hour or so, if the datetime range is 2 years, it should build aggregates for months). On the y-axis then there would be the count of events for each time-aggregation-period, i.e. 
2012-12-04 -> 1, 2012-12-05 -> 2 (for event1) and 1 (for event2) and so on. 
 
You don't have to provide a fully working example (although I wouldn't mind) but any help would be appreciated (in particular, if I have to write scripts, where do I enter them etc) 
 
Thanks alot in advance!

Find more posts tagged with

Comments

kclark

<a class='bbc_url' href='http://www.birt-exchange.org/org/devshare/designing-birt-reports/412-change-birt-chart-interval-type-at-runtime/'>Take a look at this devshare</a> it shows how to change the x-axis from days, weeks, months, and years. 
 
It uses this code in the beforeFactory() 
 
<pre class='_prettyXprint _lang-auto _linenums:0'>
importPackage( Packages. org.eclipse.birt.chart.model);
importPackage( Packages. org.eclipse.birt.chart.model.attribute);

rptDesignHandle = reportContext.getReportRunnable().designHandle.getDesignHandle();
chart = rptDesignHandle.findElement("NewChart");
item = chart.getReportItem();
cm = item.getProperty("chart.instance");

xAxis = cm.getAxes( ).get( 0 );
xSeriesDef = xAxis.getSeriesDefinitions( ).get( 0 );
xGrouping = xSeriesDef.getGrouping( );
//xGrouping.setGroupingInterval( 1 );

if (params["IntervalParam"].equals("Days")) {
xGrouping.setGroupingUnit(GroupingUnitType.DAYS_LITERAL);
} else if (params["IntervalParam"].equals("Weeks")) {
xGrouping.setGroupingUnit(GroupingUnitType.WEEKS_LITERAL);
} else if (params["IntervalParam"].equals("Months")) {
xGrouping.setGroupingUnit(GroupingUnitType.MONTHS_LITERAL);
} else if (params["IntervalParam"].equals("Years")) {
xGrouping.setGroupingUnit(GroupingUnitType.YEARS_LITERAL);
}

//set the chart title
cm.getTitle().getLabel().getCaption().setValue("Order Data by "+params["IntervalParam"]);
</pre>
 
So you should be able to use setGroupingUnit(); to modify the grouping.

jakoby84

Yay, that's exactly what I was looking for. Thanks alot!

By the way, is it somehow possible to have code completion inside the javascript editors (working on eclipse juno). If not, how do I look up the possibilities which I have with js in BIRT? I perfectly understand the working example but don't have a clue how I would have looked up those by myself...

jakoby84

Ok, I now implemented the example code in my application. But in contrast to the provided example I want to set the GroupingUnit not based on a user parameter but dynamically based on the data. Like:

if (dateRange < 5 days) -> GroupingUnit = HOURS
else -> GroupingUnit -> GroupingUnit = DAYS

The problem now is that I would need the Total.max() / .min() functions but they don't work (BIRT 4.2.1):

org.mozilla.javascript.EcmaError: ReferenceError: "Total" is not defined. (/report/method[@name="beforeFactory"]#14)

Then I tried to add a column binding / aggregate for the chart element. But I can't figure out how to access a chart's column binding inside the 'beforeFactory'-method...

Thanks for any advice