历史博文中有讲解在请求中输出基础图表的方式，见地址：

本文讲述在OAF中集成这两类图表。

集成的基本思路：在OAF页面中加入一个rawText组件，在rawText中加入html代码即可，如此简单。

步骤一：官网下载echarts,highcharts相应的js，放入OA_HTML路径（本例在OA_HTML中加入了文件夹cux）。

步骤二：写OAF页面及CO。

ECharts示例

EChartsPG

对应的CO(本代码中只给出了静态数据示例)：

package cux.oracle.apps.cux.test.webui;import oracle.apps.fnd.common.VersionInfo;import oracle.apps.fnd.framework.webui.OAControllerImpl;import oracle.apps.fnd.framework.webui.OAPageContext;import oracle.apps.fnd.framework.webui.beans.OARawTextBean;import oracle.apps.fnd.framework.webui.beans.OAWebBean;/** * Controller for ... */public class TestPGCO extends OAControllerImpl{  public static final String RCS_ID="$Header$";  public static final boolean RCS_ID_RECORDED =        VersionInfo.recordClassVersion(RCS_ID, "%packagename%");  /**   * Layout and page setup logic for a region.   * @param pageContext the current OA page context   * @param webBean the web bean corresponding to the region   */  public void processRequest(OAPageContext pageContext, OAWebBean webBean)  {    super.processRequest(pageContext, webBean);//      pageContext.removeJavaScriptLibrary("echarts");      if(pageContext.getJavaScriptLibrary("echarts")==null){          pageContext.putJavaScriptLibrary("echarts","cuxjs/echarts.min.js");               }            OARawTextBean rawTextBean =           (OARawTextBean)webBean.findChildRecursive("EchartsRowText");      if (rawTextBean != null) {          String rawTextMessage = null;          rawTextMessage = "\n" +           "\n" +           "    
     \n" +           "    
     
\n" +           "    \n" +           "\n" +           "";          rawTextBean.setText(rawTextMessage);      }      }  /**   * Procedure to handle form submissions for form elements in   * a region.   * @param pageContext the current OA page context   * @param webBean the web bean corresponding to the region   */  public void processFormRequest(OAPageContext pageContext, OAWebBean webBean)  {    super.processFormRequest(pageContext, webBean);  }}

效果如下：

 

 

HCharts示例：

对应的CO(本代码中只给出了静态数据示例)：

package cux.oracle.apps.cux.test.webui;import oracle.apps.fnd.common.VersionInfo;import oracle.apps.fnd.framework.webui.OAControllerImpl;import oracle.apps.fnd.framework.webui.OAPageContext;import oracle.apps.fnd.framework.webui.beans.OARawTextBean;import oracle.apps.fnd.framework.webui.beans.OAWebBean;/** * Controller for ... */public class TestHChartsPGCO extends OAControllerImpl{  public static final String RCS_ID="$Header$";  public static final boolean RCS_ID_RECORDED =        VersionInfo.recordClassVersion(RCS_ID, "%packagename%");  /**   * Layout and page setup logic for a region.   * @param pageContext the current OA page context   * @param webBean the web bean corresponding to the region   */  public void processRequest(OAPageContext pageContext, OAWebBean webBean)  {    super.processRequest(pageContext, webBean);//      pageContext.removeJavaScriptLibrary("hcharts");      if(pageContext.getJavaScriptLibrary("hcharts")==null){          pageContext.putJavaScriptLibrary("hcharts","cuxjs/highcharts.js");       };                  OARawTextBean rawTextBean =           (OARawTextBean)webBean.findChildRecursive("HChartsRowText");      if (rawTextBean != null) {          String rawTextMessage = null;          rawTextMessage =    "\n" +                               "\n" +                               "    
     \n" +                               "    
     \n" +                               "    
     
\n" +                               "    \n" +                               "\n" +                               "";          rawTextBean.setText(rawTextMessage);      }      }  /**   * Procedure to handle form submissions for form elements in   * a region.   * @param pageContext the current OA page context   * @param webBean the web bean corresponding to the region   */  public void processFormRequest(OAPageContext pageContext, OAWebBean webBean)  {    super.processFormRequest(pageContext, webBean);  }}

显示效果如下：