第三方图表插件

前言

FineReport除了内置的图表、新特性图表插件外，还提供了第三方图表开发的API，方便进行个性化、第三方的图表开发。但是第三方图表API接口过于复杂，用户很难快速的实现并使用自己想使用的第三方新图表。

解决方法

在原有的图表接口基础之上，对接口进行了简化和修改，让用户可以快速的写出第三方图表插件并使用。

关键接口

插件图表接口

IndependentChartProvider

package com.fr.chart.fun;

import com.fr.chart.chartattr.Chart;
import com.fr.stable.fun.Level;

/**
 * Created by eason on 15/4/21.
 * 图表接口
 */
public interface IndependentChartProvider extends Level {

 String XML_TAG = "IndependentChartProvider";

 int CURRENT_API_LEVEL = 3;

 /**
 * 图表的国际化的名字的key
 *
 * @return 图表国际化的名字的key
 */
 String getChartName();

 /**
 * 该种图表所有的图表类型，比如柱形图就有堆积柱形图，百分比堆积柱形图等等
 *
 * @return 所有的图表类型
 */
 Chart[] getChartTypes();

 /**
 * 图表在web端展现时需要的JS文件
 *
 * @return JS文件数组
 */
 String[] getRequiredJS();

 /**
 * JS对象名，该对象一般是一个函数，执行后会在给定的dom中绘制图表
 *
 * @return JS对象名
 */
 String getWrapperName();

 /**
 * 定义在设计器里展现的图的路径
 *
 * @return 图的路径
 */
 String getChartImagePath();

}

上述接口用户需要直接实现，里面具体需要实现的方法示例如下：

DemoChartsPie implements IndependentChartProvider

package com.fr.plugins.democharts.pie;

import com.fr.chart.chartattr.Chart;
import com.fr.chart.fun.IndependentChartProvider;

public class DemoChartsPie implements IndependentChartProvider {

    public static pieChart[] charts = new pieChart[] {
            new pieChart(),
    };


    @Override
    public String getChartName() {
        return "用户自定义图表";
    }

    @Override
    public String[] getRequiredJS() {
        return new String[]{
                "/com/fr/plugins/democharts/common/web/echarts.bridge.js"
        };
    }
    @Override
    public String getWrapperName() {
        return "EChartsFactory";
    }

    @Override
    public Chart[] getChartTypes() {
        return charts;
    }

    @Override
    public String getChartImagePath() {
        return "com/fr/plugins/democharts/pie/images/pie256.png";
    }

    @Override
    public int currentAPILevel() {
        return 3;
    }
}

插件图表界面接口

IndependentChartUIProvider

package com.fr.design.chart.fun;

/**
 * Created by eason on 14/12/29.
 *
 * @since 8.0
 * 自定义图表类型设设计界面接口
 */
public interface IndependentChartUIProvider extends Level {

 String XML_TAG = "IndependentChartUIProvider";

 int CURRENT_API_LEVEL = 3;


/**
 * 当前接口的API等级,用于判断是否需要升级插件
 *
 * @return API等级
 */
int currentAPILevel();
 /**
 * 图表配置面板
 *
 * @return图表配置面板
 */
 ChartEditPaneProvider getChartConfigPane(String plotID);

 ......(其他方法不用实现)
}

此接口用户不必实现，只需要继承实现了该接口的抽象类： AbstractIndependentChartUI4Custom 类即可，并实现相应方法，示例如下：

DemoChartsPieUI extends AbstractIndependentChartUI4Custom

package com.fr.plugins.democharts.pie;

import com.fr.design.chart.fun.impl.AbstractIndependentChartUI4Custom;
import com.fr.design.gui.chart.ChartEditPaneProvider;


public class DemoChartsPieUI extends AbstractIndependentChartUI4Custom {
    @Override
    public ChartEditPaneProvider getChartConfigPane(String plotID) {
        return new ChartConfigPane();
    }

    @Override
    public int currentAPILevel() {
        return 3;
    }
}

关键抽象类

ThirdChartEditPane

package com.fr.design.mainframe.chart;

import javax.swing.*;
import java.awt.*;

/**
 * Created by mengao on 2017/5/3.
 */
public abstract class ThirdChartEditPane extends ChartEditPane implements ChartEditPaneProvider, ThirdChartInterface {

protected abstract void populateBean(Object ob);

protected abstract void updateBean(Object ob);
    ......

}

用户的图表配置面板ChartConfigPane类需要继承此抽象类，并实现相应的方法，示例如下：

ChartConfigPane extends ThirdChartEditPane



package com.fr.chart.chartattr;

import com.fr.base.chart.BaseChartGlyph;
import com.fr.base.chart.BaseChartPainter;
import com.fr.base.chart.ChangeConfigProvider;
import com.fr.base.chart.chartdata.ChartData;
import com.fr.chart.chartglyph.ChartGlyph;
import com.fr.chart.chartglyph.PlotGlyph;
import com.fr.stable.web.Repository;

import java.awt.*;
import java.awt.geom.RectangularShape;
import java.util.Iterator;
import java.util.Map;

/**
 * Created by mengao on 2017/5/3.
 * 用户使用第三方图表需要继承chart父类
 */
public abstract class ThirdChart extends Chart implements BaseChartGlyph {
 ......
}

（2）ThirdChart

用户的图表配置面板ChartConfig类需要继承此抽象类，并实现

关键配置

<extra-chart>
 <IndependentChartProvider class="com.fr.plugins.democharts.pie.DemoChartsPie"
 plotID="DemoChartsPiePlot"/>
</extra-chart>
<extra-chart-designer>
 <IndependentChartUIProvider class="com.fr.plugins.democharts.pie.DemoChartsPieUI"
 plotID="DemoChartsPiePlot"/>
</extra-chart-designer>

Page tree