Skip to Main Content

APEX

Announcement

For appeals, questions and feedback about Oracle Forums, please email oracle-forums-moderators_us@oracle.com. Technical questions should be asked in the appropriate category. Thank you!

Interested in getting your voice heard by members of the Developer Marketing team at Oracle? Check out this post for AppDev or this post for AI focus group information.

Fusion Charts Demo

PostieAug 27 2008 — edited Jan 7 2011
Hi everyone

After searching far & wide.. for a demo of [Fusion Charts|www.fusioncharts.com].. I sat down & reviewed fusionchart website...

I have now developed a simple working example for everyone.. in one PL/SQL region.. this will work with APEX sample application

Firstly you need to download the demo
And copy/install to your webserver.. I created a charts subdirectory can put all of the install there

Create a new page, then create a PL/SQL region with this code
DECLARE
   l_xml             VARCHAR2 (32767);
   p_region_width    VARCHAR2 (10)    := '700';
   p_region_height   VARCHAR2 (10)    := '300';
   p_chart_debug     VARCHAR2 (10)    := '0';
BEGIN
   l_xml := '<chart caption=''Product Sales'' ';
   l_xml := l_xml || 'subcaption=''by Product'' ';
   l_xml := l_xml || 'xAxisName=''Product'' ';
   l_xml := l_xml || 'yAxisName=''Sales'' ';
   l_xml := l_xml || 'numberPrefix=''$''>';
   l_xml := l_xml || '>';

   FOR d IN (SELECT   p.CATEGORY, SUM (o.unit_price * o.quantity) price
                 FROM demo_order_items o, demo_product_info p
                WHERE p.product_id = o.product_id
             GROUP BY p.CATEGORY)
   LOOP
      l_xml :=
            l_xml
         || '<set label='''
         || d.CATEGORY
         || ''' value='''
         || d.price
         || ''' />';
   END LOOP;

   l_xml := l_xml || '</chart>';
   HTP.p
      (   '
<div id="chartdiv" align="center">FusionGadgets</div>
<script language="JavaScript" src="/i/Charts/Code/FusionCharts/FusionCharts.js"></script>
<script type="text/javascript">
var myChart = new FusionCharts("/i/Charts/Code/FusionCharts/Column3D.swf", "myChartId", "'
       || p_region_width
       || '", "'
       || p_region_height
       || '", "'
       || p_chart_debug
       || '", "0");
myChart.setDataXML("'
       || l_xml
       || '");
myChart.render("chartdiv");
</script>
'
      );
END;
Then quite easy to change teh chart Type, add in extra settings etc... using support fusioncharts documentation

Will post a AnyChart 4.1 example shortly

Dean

Edited by: Postie on Aug 28, 2008 8:33 AM

Comments

Locked Post
New comments cannot be posted to this locked post.

Post Details

Locked on Feb 4 2011
Added on Aug 27 2008
13 comments
5,774 views