早些时候用到了Echarts,觉得比之前用的funshioncharts好用太多!可是拼装数据到前台显示的时候,有点费时费力,于是对Echarts在后台做了封装。具体做法了抽象出众图类、零件之上用零件组装成组件(坐标轴、标题、提示、图例、工具箱、数据项之类),组件之上抽象出图类(柱状图、折线图、饼图、仪表盘、地图、漏斗图之类),然后根据这些图类在图形工厂里灵活组装代码生成整个option对象。这样在只要一行代码就可以得到option对象,大大减少化了后台的代码量和前台的代码量,同时也降低了开发难度,不需要了解太多echarts的知识,便可以以我封装出的组件做出图表。由于时间关系,暂时只封装了常用到的柱状图、柱状堆积图、折线图、面积图、柱状折线混搭图、饼图、环形图、玫瑰图、仪表盘、漏斗图。
最近又对代码进行了升级,针对Echarts5.0做了全面改动(2021年8月),代码已上传至github,拜托小伙伴们给个star哦:https://github.com/liboyi/echarts-java
maven依赖:
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>fastjson</artifactId>
<version>1.2.76</version>
</dependency>
<dependency>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
<version>1.18.20</version>
<scope>provided</scope>
</dependency>
总体设计原则:
1)分层,使代码结构清晰,易于维护。
2)尽力将开发的代码量降低到最少。
3)不需要了解接口调用者去了解Echarts的知识。
程序框架:
图形工厂代码如下:
/**
* @author liboyi
* @title: BaseFactory
* @description: 图形工厂基类
* @date 2021/8/25 0:36
*/
public class BaseFactory {
/**
* 通用构建title
* @param title title
* @param subTitle subTitle
* @param left left
* @param top top
* @param fontSize fontSize
* @return
*/
public static ChartsTitleBean buildTitle(String title, String subTitle, String left, String top, Integer fontSize){
ChartsTitleBean titleBean = ChartsTitleBean.builder().text(title).
subtext(subTitle).x(left).y(top).build();
if(fontSize != null){
titleBean.setTextStyle(TextStyle.builder().fontSize(fontSize).build());
}
return titleBean;
}
/**
* 构建XAis
* @param xAxisName xAxisName
* @param xData xData
* @return XAxisBean
*/
public static XAxisBean buildXAis(String xAxisName, List<String> xData){
return XAxisBean.builder().name(xAxisName).data(xData).build();
}
/**
* 构建YAxisBean
* @param xAxisName xAxisName
* @param xData xData
* @return XAxisBean
*/
public static YAxisBean buildYAis(String yAxisName){
return YAxisBean.builder().name(yAxisName).build();
}
/**
* 构建 Feature
* @param markShow markShow
* @param dataViewShow dataViewShow
* @param magicTypeShow magicTypeShow
* @param restoreShow restoreShow
* @param saveAsImageShow saveAsImageShow
* @param magicTypeList magicTypeList
* @return
*/
public static Feature getFeature(boolean markShow, boolean dataViewShow, boolean magicTypeShow, boolean restoreShow,
boolean saveAsImageShow, List<String> magicTypeList) {
Mark mark = new Mark(markShow);
DataView dataView = new DataView(dataViewShow);
MagicType magicType = new MagicType(magicTypeShow,magicTypeList);
Restore restore = new Restore(restoreShow);
SaveAsImage saveAsImage = new SaveAsImage(saveAsImageShow);
return Feature.builder().mark(mark).dataView(dataView).magicType(magicType).restore(restore).
saveAsImage(saveAsImage).build();
}
}
/**
* @author liboyi
* @title PieFactory
* @description 饼图图形工厂
* @date 2021/8/18
*/
public class BarFactory extends BaseFactory{
private BarFactory(){
}
/**
* 创建柱状图/柱状堆积
* @param barChartRequest barChartRequest
* @return Object
*/
public static Object createBar(BarChartRequest barChartRequest){
String formatter = StringUtils.hasLength(barChartRequest.getUnit()) ? "{value}" + barChartRequest.getUnit() : "{value}";
List<ChartsBarSeriesBean> series = new ArrayList<>();
//拿到图例
List<String> legend = new ArrayList<>();
String backgroundColor = "rgba(180, 180, 180, 0.2)";
if(!CollectionUtils.isEmpty(barChartRequest.getData())){
for (int i = 0; i < barChartRequest.getData().size(); i++) {
legend.add(barChartRequest.getData().get(i).getName());
ChartsBarSeriesBean temp = new ChartsBarSeriesBean();
temp.setName(barChartRequest.getData().get(i).getName());
temp.setStack(barChartRequest.getData().get(i).getStack());
temp.setData(barChartRequest.getData().get(i).getData());
temp.setType("bar");
temp.setShowBackground(true);
temp.setBackgroundStyle(new BackgroundStyle(backgroundColor));
series.add(temp);
}
}
BarOptionBean option = new BarOptionBean();
//设置标题
ChartsTitleBean title = getChartsTitleBean(barChartRequest);
option.setTitle(title);
//设置工具提示
option.setTooltip(new ToolTipBean());
//设置工具栏
List<String> type = Arrays.asList("bar", "line");
Feature feature = getFeature(true, true, true, true,
true, type);
ChartsToolBoxBean toolbox = new ChartsToolBoxBean(true);
toolbox.setFeature(feature);
option.setToolbox(toolbox);
//设置图例
LegendBean legendBean = getLegendBean(barChartRequest, legend);
option.setLegend(legendBean);
//设置x轴
option.setXAxis(buildXAis(barChartRequest.getXAxisName(),barChartRequest.getXData()));
//设置y轴
YAxisBean yAxis = new YAxisBean();
AxisLabel axisLabel = new AxisLabel(formatter);
yAxis.setAxisLabel(axisLabel);
yAxis.setName(barChartRequest.getYAxisName());
option.setYAxis(yAxis);
//数据
option.setSeries(series);
return JSONObject.toJSON(option);
}
/**
* getLegendBean
* @param barChartRequest barChartRequest
* @param legend legend
* @return LegendBean
*/
private static LegendBean getLegendBean(BarChartRequest barChartRequest, List<String> legend) {
String leftOfLegend = Optional.ofNullable(barChartRequest.getLeftOfLegend()).orElse("center");
String topOfLegend = Optional.ofNullable(barChartRequest.getTopOfLegend()).orElse("top");
return LegendBean.builder().left(leftOfLegend).top(topOfLegend).data(legend).build();
}
/**
* 创建柱状折线混搭图
* @param barChartRequest barChartRequest
* @return Object
*/
public static Object mixedLineAndBar(BarChartRequest barChartRequest){
List<ChartsBarSeriesBean> series = new ArrayList<>();
if(!CollectionUtils.isEmpty(barChartRequest.getData())){
for (ChartDataBean barDataBean : barChartRequest.getData()) {
ChartsBarSeriesBean barSeries = new ChartsBarSeriesBean();
barSeries.setData(barDataBean.getData());
barSeries.setName(barDataBean.getName());
barSeries.setStack(barDataBean.getStack());
series.add(barSeries);
}
}
if(!CollectionUtils.isEmpty(barChartRequest.getLineList())){
for (ChartDataBean lineDataBean : barChartRequest.getLineList()) {
ChartsBarSeriesBean barSeries = new ChartsBarSeriesBean();
barSeries.setData(lineDataBean.getData());
barSeries.setName(lineDataBean.getName());
barSeries.setType("line");
barSeries.setYAxisIndex(1);
series.add(barSeries);
}
}
BarLineMixedOptionBean option = new BarLineMixedOptionBean();
String y1Formatter = StringUtils.hasLength(barChartRequest.getUnit()) ? "{value}" + barChartRequest.getUnit() : "{value}";
String y2Formatter = StringUtils.hasLength(barChartRequest.getY2Unit()) ? "{value}" + barChartRequest.getY2Unit() : "{value}";
//拿到图例
List<String> legend = new ArrayList<>();
if(!CollectionUtils.isEmpty(series)){
for (int i = 0; i < series.size(); i++) {
legend.add(series.get(i).getName());
}
}
//设置标题
ChartsTitleBean title = getChartsTitleBean(barChartRequest);
option.setTitle(title);
//设置工具提示
option.setTooltip(new ToolTipBean());
//设置工具栏
ChartsToolBoxBean toolbox = new ChartsToolBoxBean(true);
Feature feature = getFeature(true, true, false, true,
true, null);
toolbox.setFeature(feature);
option.setToolbox(toolbox);
//设置图例
option.setLegend(getLegendBean(barChartRequest, legend));
//设置x轴
option.setXAxis(buildXAis(barChartRequest.getXAxisName(),barChartRequest.getXData()));
//设置y轴
List<YAxisBean> yAxis = new ArrayList<>();
YAxisBean y1 = YAxisBean.builder().axisLabel(new AxisLabel(y1Formatter)).name(barChartRequest.getYAxisName()).build();
yAxis.add(y1);
YAxisBean y2 = YAxisBean.builder().axisLabel(new AxisLabel(y2Formatter)).name(barChartRequest.getY2AxisName()).build();
yAxis.add(y2);
option.setYAxis(yAxis);
//数据
option.setSeries(series);
return JSONObject.toJSON(option);
}
/**
* getChartsTitleBean
* @param barChartRequest barChartRequest
* @return ChartsTitleBean
*/
private static ChartsTitleBean getChartsTitleBean(BarChartRequest barChartRequest) {
String left = Optional.ofNullable(barChartRequest.getLeft()).orElse("left");
String top = Optional.ofNullable(barChartRequest.getTop()).orElse("top");
return buildTitle(barChartRequest.getTitle(), barChartRequest.getSubTitle(), left, top,
barChartRequest.getFontSize());
}
}
/**
* @author liboyi
* @title FunnelFactory
* @description 漏斗图形工厂
* @date 2021/8/22 15:25
*/
public class FunnelFactory extends BaseFactory{
/**
* 创建漏斗图
* @param funnelChartRequest funnelChartRequest
* @return Object
*/
public static Object createFunnel(FunnelChartRequest funnelChartRequest){
FunnelOptionBean option=new FunnelOptionBean();
//设置标题
String x = Optional.ofNullable(funnelChartRequest.getLeft()).orElse("left");
ChartsTitleBean title = ChartsTitleBean.builder().text(funnelChartRequest.getTitle()).
subtext(funnelChartRequest.getSubTitle()).x(x).y(funnelChartRequest.getTop()).build();
if(funnelChartRequest.getFontSize() != null){
TextStyle textStyle = new TextStyle();
textStyle.setFontSize(funnelChartRequest.getFontSize());
title.setTextStyle(textStyle);
}
option.setTitle(title);
//设置图例
String left = Optional.ofNullable(funnelChartRequest.getTop()).orElse("center");
String top = Optional.ofNullable(funnelChartRequest.getLeft()).orElse("top");
LegendBean legendBean = LegendBean.builder().orient(funnelChartRequest.getOrient()).left(left)
.top(top).orient(funnelChartRequest.getOrient()).build();
option.setLegend(legendBean);
//设置工具提示
option.setTooltip(ToolTipBean.builder().trigger("item").formatter("{a} <br/>{b} : {c}%").build());
//设置工具栏
Feature feature = getFeature(false,true,false,false,
true,null);
ChartsToolBoxBean toolbox = new ChartsToolBoxBean(true);
toolbox.setFeature(feature);
option.setToolbox(toolbox);
//数据
List<ChartsFunnelSeriesBean> series = new ArrayList<>();
ChartsFunnelSeriesBean funnelSeries = new ChartsFunnelSeriesBean();
funnelSeries.setName(funnelChartRequest.getTitle());
funnelSeries.setType("funnel");
funnelSeries.setData(funnelChartRequest.getData());
series.add(funnelSeries);
option.setSeries(series);
return JSONObject.toJSON(option);
}
}
/**
* @author liboyi
* @title: GaugeFactory
* @description: 仪表盘图形工厂
* @date 2021/8/18
*/
public class GaugeFactory extends BaseFactory{
/**
* 基础仪表盘
* @param gauageChartsRequest gauageChartsRequest
* @return Object
*/
public static Object createBaseGauge(GauageChartRequest gauageChartsRequest){
GaugeOptionBean option = new GaugeOptionBean();
ChartsGaugeSeriesBean gaugeSeriesBean = new ChartsGaugeSeriesBean();
boolean showProgress = Optional.ofNullable(gauageChartsRequest.isShowProgress()).orElse(false);
gaugeSeriesBean.setProgress(new Progress(showProgress));
ChartDataBean gaugeDataBean = ChartDataBean.builder().name(gauageChartsRequest.getTitle()).
value(gauageChartsRequest.getValue()).build();
gaugeSeriesBean.setData(Arrays.asList(gaugeDataBean));
option.setSeries(Arrays.asList(gaugeSeriesBean));
return JSONObject.toJSON(option);
}
}
/**
* @author liboyi
* @title: LineFactory
* @description: 折线图图形工厂
* @date 2021/8/23 23:29
*/
public class LineFactory extends BaseFactory{
private LineFactory(){
}
/**
* 创建折线图/支持平滑折线图/折线图堆叠
* @param lineChartRequest lineChartRequest
* @return Object
*/
public static Object createLine(LineChartRequest lineChartRequest){
List<String> magicTypeList = Optional.ofNullable(lineChartRequest.getMagicTypeList()).orElse(Arrays.asList("line", "bar"));
lineChartRequest.setMagicTypeList(magicTypeList);
LineOptionBean option = getLineOptionBean(lineChartRequest,"line");
return JSONObject.toJSON(option);
}
/**
* getLineOptionBean
* @param lineChartRequest lineChartRequest
* @param chartType chartType
* @return LineOptionBean
*/
private static LineOptionBean getLineOptionBean(LineChartRequest lineChartRequest,String chartType) {
List<ChartsLineSeriesBean> series = new ArrayList<>();
LineOptionBean option = new LineOptionBean();
//拿到图例
List<String> legendData = new ArrayList<>();
Boolean smooth = Optional.ofNullable(lineChartRequest.getSmooth()).orElse(false);
if(!CollectionUtils.isEmpty(lineChartRequest.getData())){
for (int i = 0; i < lineChartRequest.getData().size(); i++) {
legendData.add(lineChartRequest.getData().get(i).getName());
ChartsLineSeriesBean temp = new ChartsLineSeriesBean();
temp.setName(lineChartRequest.getData().get(i).getName());
temp.setData(lineChartRequest.getData().get(i).getData());
temp.setType("line");
temp.setStack(lineChartRequest.getData().get(i).getStack());
temp.setSmooth(smooth);
if("area".equals(chartType)){
temp.setAreaStyle(new AreaStyle());
}
series.add(temp);
}
}
if("area".equals(chartType)){
option.setGrid(Grid.builder().left("3%").right("4%").bottom("3%").containLabel(true).build());
}
//设置标题
String left = Optional.ofNullable(lineChartRequest.getLeft()).orElse("left");
ChartsTitleBean title = buildTitle(lineChartRequest.getTitle(),lineChartRequest.getSubTitle(),
left,lineChartRequest.getTop(),lineChartRequest.getFontSize());
option.setTitle(title);
//设置工具提示
option.setTooltip(getToolTip(chartType));
//设置工具栏
ChartsToolBoxBean toolbox = new ChartsToolBoxBean(true);
List<String> type = Arrays.asList("line", "bar");
Feature feature = getFeature(true,true,true,true,
true,type);
toolbox.setFeature(feature);
option.setToolbox(toolbox);
//设置图例
option.setLegend(new LegendBean(legendData));
//设置x轴
option.setXAxis(buildXAis(lineChartRequest.getXAxisName(),lineChartRequest.getXData()));
//设置y轴
option.setYAxis(buildYAis(lineChartRequest.getYAxisName()));
//数据
option.setSeries(series);
return option;
}
/**
* getToolTip
* @param chartType chartType
* @return ToolTipBean
*/
private static ToolTipBean getToolTip(String chartType){
if("line".equals(chartType)){
return ToolTipBean.builder().trigger("axis").build();
}else if("area".equals(chartType)){
Label label = Label.builder().backgroundColor("#6a7985").build();
AxisPointer axisPointer = AxisPointer.builder().type("cross").label(label).build();
return ToolTipBean.builder().axisPointer(axisPointer).trigger("axis").build();
}
return null;
}
/**
* 标准面积图/堆积面积图
* @param lineChartRequest lineChartRequest
* @return Object
*/
public static Object createArea(LineChartRequest lineChartRequest){
List<String> magicTypeList = Optional.ofNullable(lineChartRequest.getMagicTypeList()).
orElse(Arrays.asList("line","bar","stack","tiled"));
lineChartRequest.setMagicTypeList(magicTypeList);
LineOptionBean option = getLineOptionBean(lineChartRequest,"area");
return JSONObject.toJSON(option);
}
}
**
* @author liboyi
* @title: PieFactory
* @description 饼图图形工厂
* @date 2021/8/18
*/
public class PieFactory extends BaseFactory{
/**
* 创建饼图
* @param pieChartRequest pieChartRequest
* @return Object
*/
public static Object createPie(PieChartRequest pieChartRequest){
if(CollectionUtils.isEmpty(pieChartRequest.getRadius())){
pieChartRequest.setRadius(Arrays.asList("50%"));
}
if(!StringUtils.hasLength(pieChartRequest.getLeftOfLegend())){
pieChartRequest.setLeftOfLegend("left");
}
if(!StringUtils.hasLength(pieChartRequest.getTopOfLegend())){
pieChartRequest.setTopOfLegend("top");
}
if(!StringUtils.hasLength(pieChartRequest.getOrient())){
pieChartRequest.setOrient("vertical");
}
return buildPie(pieChartRequest);
}
/**
* 创建环形图
* @param pieChartRequest pieChartRequest
* @return Object
*/
public static Object createRing(PieChartRequest pieChartRequest){
pieChartRequest.setType("ring");
if(!CollectionUtils.isEmpty(pieChartRequest.getRadius())){
pieChartRequest.setRadius(Arrays.asList("40%","70%"));
}
return buildPie(pieChartRequest);
}
/**
* 创建圆角环形图
* @param pieChartRequest pieChartRequest
* @return Object
*/
public static Object createRingWithRoundedCorner(PieChartRequest pieChartRequest){
if(!CollectionUtils.isEmpty(pieChartRequest.getRadius())){
pieChartRequest.setRadius(Arrays.asList("40%","70%"));
}
if(StringUtils.hasLength(pieChartRequest.getBorderColor())){
pieChartRequest.setBorderColor("#fff");
}
if(pieChartRequest.getBorderRadius() == null){
pieChartRequest.setBorderRadius(10);
}
if(pieChartRequest.getBorderWidth() == null){
pieChartRequest.setBorderWidth(2);
}
pieChartRequest.setType("ring");
return buildPie(pieChartRequest);
}
/**
* 创建玫瑰图
* @param pieChartRequest pieChartRequest
* @return Object
*/
public static Object createRose(PieChartRequest pieChartRequest){
pieChartRequest.setType("rose");
String top = Optional.ofNullable(pieChartRequest.getTop()).orElse("bottom");
pieChartRequest.setTop(top);
List<String> radius = Optional.ofNullable(pieChartRequest.getRadius()).orElse(Arrays.asList("50","250"));
pieChartRequest.setRadius(radius);
return buildPie(pieChartRequest);
}
/**
* 饼图和环形图生成json
* @param pieChartRequest pieChartRequest
* @return Object
*/
private static Object buildPie(PieChartRequest pieChartRequest){
String left = Optional.ofNullable(pieChartRequest.getLeft()).orElse("center");
PieOptionBean option = new PieOptionBean();
//设置标题
ChartsTitleBean title = ChartsTitleBean.builder().text(pieChartRequest.getTitle()).
subtext(pieChartRequest.getSubTitle()).x(left).y(pieChartRequest.getTop()).build();
option.setTitle(title);
//设置工具提示
ToolTipBean tooltip = new ToolTipBean();
tooltip.setTrigger("item");
option.setTooltip(tooltip);
//设置工具栏
ChartsToolBoxBean toolbox = new ChartsToolBoxBean(true);
List<String> type = Arrays.asList("pie", "funnel");
Feature feature = getFeature(false,true,true,true,
true,type);
toolbox.setFeature(feature);
option.setToolbox(toolbox);
//设置图例
LegendBean legendBean = LegendBean.builder().orient(pieChartRequest.getOrient()).left(pieChartRequest.getLeftOfLegend())
.top(pieChartRequest.getTopOfLegend()).build();
option.setLegend(legendBean);
List<ChartsPieSeriesBean> series = new ArrayList<>();
ChartsPieSeriesBean pieSeries = new ChartsPieSeriesBean();
ItemStyle itemStyle = ItemStyle.builder().borderColor(pieChartRequest.getBorderColor()).
borderRadius(pieChartRequest.getBorderRadius()).borderWidth(pieChartRequest.getBorderWidth()).build();
pieSeries.setItemStyle(itemStyle);
//数据
pieSeries.setName(pieChartRequest.getTitle());
pieSeries.setType("pie");
if(pieChartRequest.getType().equals("rose")){
pieSeries.setRoseType("area");
}
Object radius = pieChartRequest.getRadius().size()==1 ? pieChartRequest.getRadius().get(0) : pieChartRequest.getRadius();
pieSeries.setRadius(radius);
pieSeries.setData(pieChartRequest.getData());
pieSeries.setEmphasis(getItemStyleEmphasis());
series.add(pieSeries);
option.setSeries(series);
return JSONObject.toJSON(option);
}
/**
* getItemStyleEmphasis
* @return Emphasis
*/
private static Emphasis getItemStyleEmphasis() {
Emphasis itemStyleEmphasis = new Emphasis();
itemStyleEmphasis.setShadowBlur(10);
itemStyleEmphasis.setShadowOffsetX(0);
itemStyleEmphasis.setShadowColor("rgba(0, 0, 0, 0.5)");
return itemStyleEmphasis;
}
}
柱状图示例:
/**
* @author liboyi
* @title: BarChartSample
* @description 柱状图示例
* @date 2021/8/3 10:34
*/
public class BarChartSample {
public static void main(String[] args) {
List<String> xData = Arrays.asList("Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun");
BarChartRequest barChartRequest = new BarChartRequest();
barChartRequest.setTitle("柱状图");
barChartRequest.setXData(xData);
List<ChartDataBean> data = new ArrayList<>();
data.add(ChartDataBean.builder().data(Arrays.asList(120, 200, 150, 80, 70, 110, 130)).name("蒸发量").build());
barChartRequest.setData(data);
System.out.println("柱状图Option:" + BarFactory.createBar(barChartRequest));
List<ChartDataBean> barList = new ArrayList<>();
barList.add(ChartDataBean.builder().data(Arrays.asList(120, 200, 150, 80, 70, 110, 130)).name("蒸发量").build());
List<ChartDataBean> lineList = new ArrayList<>();
lineList.add(ChartDataBean.builder().data(Arrays.asList(210, 100, 50, 40, 10, 40, 30)).name("降雨量").build());
BarChartRequest barChartRequest2 = new BarChartRequest();
barChartRequest2.setTitle("柱状折线混搭图");
barChartRequest2.setXData(xData);
barChartRequest2.setData(barList);
barChartRequest2.setLineList(lineList);
System.out.println("柱状折线混搭图Option:" + BarFactory.mixedLineAndBar(barChartRequest2));
}
}
漏斗图示例:
/**
* @author liboyi
* @title: FunnelChartSample
* @description 漏斗图示例
* @date 2021/8/31 23:40
*/
public class FunnelChartSample {
public static void main(String[] args) {
List<ChartDataBean> data = new ArrayList<>();
data.add(ChartDataBean.builder().name("访问").value("10").build());
data.add(ChartDataBean.builder().name("咨询").value("40").build());
data.add(ChartDataBean.builder().name("订单").value("20").build());
data.add(ChartDataBean.builder().name("点击").value("80").build());
data.add(ChartDataBean.builder().name("展现").value("100").build());
FunnelChartRequest funnelChartRequest = new FunnelChartRequest();
funnelChartRequest.setTitle("漏斗图");
funnelChartRequest.setSubTitle("纯属虚构");
funnelChartRequest.setData(data);
Object jsonObject = FunnelFactory.createFunnel(funnelChartRequest);
System.out.println("漏斗图Option:" + jsonObject);
}
}
仪表盘示例
/**
* @author liboyi
* @title: GaugeChartSample
* @description 仪表盘示例
* @date 2021/8/31 23:41
*/
public class GaugeChartSample {
public static void main(String[] args) {
GauageChartRequest gauageChartsRequest = new GauageChartRequest();
gauageChartsRequest.setTitle("基础仪表盘");
gauageChartsRequest.setShowProgress(true);
gauageChartsRequest.setValue("50");
Object jsonObject = GaugeFactory.createBaseGauge(gauageChartsRequest);
System.out.println("仪表盘Option:" + jsonObject);
}
}
折线图示例:
/**
* @author liboyi
* @title: LineChartSample
* @description 折线图示例
* @date 2021/8/31 23:41
*/
public class LineChartSample {
public static void main(String[] args) {
List<String> xData = Arrays.asList("周一", "周二", "周三", "周四", "周五", "周六", "周日");
List<ChartDataBean> list = new ArrayList<>();
list.add(ChartDataBean.builder().name("邮件营销").type("line").
data(Arrays.asList(120, 132, 101, 134, 90, 230, 210)).build());
list.add(ChartDataBean.builder().name("联盟广告").type("line").
data(Arrays.asList(220, 182, 191, 234, 290, 330, 310)).build());
list.add(ChartDataBean.builder().name("视频广告").type("line").
data(Arrays.asList(150, 232, 201, 154, 190, 330, 410)).build());
list.add(ChartDataBean.builder().name("直接访问").type("line").
data(Arrays.asList(320, 332, 301, 334, 390, 330, 320)).build());
list.add(ChartDataBean.builder().name("搜索引擎").type("line").
data(Arrays.asList(820, 932, 901, 934, 1290, 1330, 1320)).build());
LineChartRequest lineChartRequest = new LineChartRequest();
lineChartRequest.setTitle("折线图");
lineChartRequest.setXAxisName("x轴");
lineChartRequest.setXData(xData);
lineChartRequest.setYAxisName("y轴");
lineChartRequest.setData(list);
System.out.println("折线图Option:" + LineFactory.createLine(lineChartRequest));
System.out.println("面积图Option:" + LineFactory.createArea(lineChartRequest));
}
}
饼图示例:
**
* @author liboyi
* @title: PieChartSample
* @description 饼图示例
* @date 2021/8/31 23:41
*/
public class PieChartSample {
public static void main(String[] args) {
List<ChartDataBean> list = new ArrayList<>();
list.add(ChartDataBean.builder().name("搜索引擎").value("1048").build());
list.add(ChartDataBean.builder().name("直接访问").value("735").build());
list.add(ChartDataBean.builder().name("邮件营销").value("580").build());
list.add(ChartDataBean.builder().name("联盟广告").value("484").build());
list.add(ChartDataBean.builder().name("视频广告").value("300").build());
PieChartRequest pieChartRequest = new PieChartRequest();
pieChartRequest.setTitle("某站点用户访问来源");
pieChartRequest.setSubTitle("纯属虚构");
pieChartRequest.setData(list);
Object jsonObject = PieFactory.createPie(pieChartRequest);
System.out.println("饼图Option:" + jsonObject);
jsonObject = PieFactory.createRose(pieChartRequest);
System.out.println("玫瑰图Option:" + jsonObject);
jsonObject = PieFactory.createRing(pieChartRequest);
System.out.println("环形图Option:" + jsonObject);
jsonObject = PieFactory.createRingWithRoundedCorner(pieChartRequest);
System.out.println("圆角环形图Option:" + jsonObject);
}
}