Friday 25 January 2013

Apex and anychart

In Apex its easy to create flash or HTML5-charts. I think in most circumstances this will satisfy the wishes of the customer. However, sometimes I just want more....

Anychart expects an XML file with all  the data. On the website of Anychart you can find all the definitions of XML files and related charts. So you could generate the XML by yourself!

In Apex 3.1 is was possible to not just generate the type of charts provided by Oracle, but all the type of charts Anychart provided (column, cone, gauges, pyramids, etc, etc). As long as you where able to generate the correct XML file!

In Apex 4.x this no longer possible, Oracle modified the anychart-executable and you only have acces to a limited set of charts (bar, column, stacked). Unless you switch executables...., but that is not supported of course!

In apex 3,1 you also had the 32K limit. An XML file was limited to a 32K size and if you had a lot of data an error would occur.

In this 'example'(try-out) in Apex4.x I tried to pass the 32K barrier and tried to get a more generic solution for charts with a little bit more user influence.

create stored procedure to generate XML
Create a stored procedure(s) that generates the correct XML based on input-parameters.

   htp.p('Cache-Control: no-cache');
   htp.p('Pragma: no-cache');
   owa_util.http_header_close;
   htp.p('<anychart> ...

   etc

create a html region in Apex
Create a html region with the following source

       <div id="chartDiv"></div>

create a dynamic action
Create a dynamic action (by example on page load)

      chart = new AnyChart('#IMAGE_PREFIX#flashchart/anychart_6  /swf/OracleAnyChart.swf','#IMAGE_PREFIX#flashchart/anychart_6/swf/Preloader.swf');
     chart.width = 800;
     chart.height = 500;
     var ajaxRequest = new  htmldb_Get(null,$v('pFlowId'),'APPLICATION_PROCESS=getxml',$v('pFlowStepId'));
    ajaxRequest.addParam('x01', 'test');
    ajaxResult = ajaxRequest.get('HTML');
    ajaxRequest = null;
    chart.setData(ajaxResult);
    chart.write('chartDiv');


create an on demand application process (getxml)
Create an application process (on-demand)(authorization not set or ....) which returns the xml by calling the stored procedure.
The limit of 32K is no longer there. The stored procedure is responsible for the layout, colors etc.

No comments:

Post a Comment