金蝶云苍穹条形图样例

涎涎原创约 1416 字大约 5 分钟...KingdeeKingdee

70-金蝶云苍穹条形图样例.mdopen in new window

注意

本博文仅供学术研究和交流参考,严禁将其用于商业用途。如因违规使用产生的任何法律问题,使用者需自行负责。

  1. 新建空白页面动态表单

  2. 在其添加条形图,并设置其背景颜色为深黑,且设置宽高为600*400后保存

  1. 编码
package kd.bos.wzy.card;

import java.util.EventObject;

import kd.bos.form.chart.BarChart;
import kd.bos.form.plugin.AbstractFormPlugin;

/**
 * <p>Title: </p>
 * <p>
 *    Description:
 * </p>
 * <p>Copyright: Copyright (c) 2020</p>
 * @author xx
 * @date 2020年3月11日
 * @version 1.0
 */
public class BarChartPlugin extends AbstractFormPlugin {
	/**
	 * <p>Title: </p>
	 * <p>
	 *    Description:
	 * </p>
	 * <p>Copyright: Copyright (c) 2020</p>
	 * @author xx
	 * @date 2020年3月11日
	 * @param param the bare_field_name
	 * @param e
	 * @see kd.bos.entity.datamodel.events.IDataModelListener#afterCreateNewData(java.util.EventObject)
	 * @version 1.0
	 */
	@Override
	public void afterCreateNewData(EventObject e) {
		// TODO Auto-generated method stub
		super.afterCreateNewData(e);
		 BarChartHelper barChartHelper = new BarChartHelper();
		 //获得条形图控件
		 BarChart barChart = this.getControl("barchartap");
		 //调用画布填充方法
		 barChartHelper.drawChart(barChart ); 
	}
}
package kd.bos.lesson.card.plugin;

import java.math.BigDecimal;
import java.util.ArrayList;
import java.util.List;
import java.util.Map;

import com.google.common.collect.Maps;

import kd.bos.form.chart.Axis;
import kd.bos.form.chart.AxisType;
import kd.bos.form.chart.Label;
import kd.bos.form.chart.LineSeries;
import kd.bos.form.chart.PointLineChart;
import kd.bos.form.chart.Position;
/**
 * <p>Title: </p>
 * <p>
 *    Description:
 * </p>
 * <p>Copyright: Copyright (c) 2020</p>
 * @author xx
 * @date 2020年3月11日
 * see_to_overridden
 * @version 1.0
 */
public class PointLineChartHelper {

	/**
	 * void</br>
	 * 
	 * <p>Title: drawChart</p>
	 * <p>
	 *    Description:
	 * </p>
	 * <p>Copyright: Copyright (c) 2020</p>
	 * @author xx
	 * @date 2020年3月11日
	 * @param param the bare_field_name
	 * @return the bare_field_name
	 * @param pointLineChart
	 * @version 1.0
	 */
	public void drawChart(PointLineChart pointLineChart) {

		boolean isX = true;

		// 创建分类轴,X轴方式展现
		Axis categoryAxis = this.createCategoryAxis(pointLineChart, "月度", isX);

		// 设置分类轴nametextstyle属性,
		Map<String, Object> nametextstyle = Maps.newHashMap();
		nametextstyle.put("color", "#000000");
		// nametextstyle.put("fontStyle", "italic");
		nametextstyle.put("fontSize", 18);
		categoryAxis.setPropValue("nameTextStyle", nametextstyle);

		// 设置分类轴名称位置属性,end表示在最后
		categoryAxis.setPropValue("nameLocation", new String("end"));

		// 设置分类轴分类值显示位置,bottom表示在下
		categoryAxis.setPropValue("position", "bottom");
		// 设置分类轴分类值liaxisLabel属性
		Map<String, Object> axislabel = Maps.newHashMap();
		Map<String, Object> textstyle = Maps.newHashMap();
		textstyle.put("color", "#000000");
		textstyle.put("fontSize", "16");
		axislabel.put("textStyle", textstyle);
		categoryAxis.setPropValue("axisLabel", axislabel);

		// 创建数据轴,name为其名字。
		Axis ValueAxis = this.createValueAxis(pointLineChart, "千(元)", !isX);
		// 设置数据轴的nameTextStyle属性
		Map<String, Object> yAxisnametextstyle = Maps.newHashMap();
		yAxisnametextstyle.put("color", "#000000");
		yAxisnametextstyle.put("fontSize", 18);
		// yAxisnametextstyle.put("fontStyle", "oblique");
		ValueAxis.setPropValue("nameTextStyle", yAxisnametextstyle);

		// 设置分类轴数据
		categoryAxis.setCategorys(contructCatetoryData());

		// 创建折线并赋值
		this.createLineSeries(pointLineChart, "A公司销售额", contructValueData(), "red");

		// 创建多个折线按如下方式添加
		this.createLineSeries(pointLineChart, "B公司销售额", contructValue2Data(), "#0000CD");
//		 this.createLineSeries(pointLineChart,"高度", contructValue3Data(), "#282828");

		// 设置图的边距
		pointLineChart.setMargin(Position.right, "80px");
		pointLineChart.setMargin(Position.top, "80px");
		pointLineChart.setMargin(Position.left, "80px");

		// 设置图例的位置
		pointLineChart.setLegendPropValue("top", "8%");
		// 设置图例中文字的字体大小和颜色等
		Map<String, Object> legendtextstyle = Maps.newHashMap();
		legendtextstyle.put("fontSize", 18);
		legendtextstyle.put("color", "#000000");
		pointLineChart.setLegendPropValue("textStyle", legendtextstyle);

		// 刷新图标
		pointLineChart.refresh();
	}

	/** Axis</br>
	 * 
	 * <p>Title: </p>
	 * <p>
	 *    Description:
	 * 创建类目型坐标轴
	 *
	 * @param name
	 *            坐标轴名称
	 * @param isX
	 *            是否X轴,ture创建X轴,false创建Y轴
	 * </p>
	 * <p>Copyright: Copyright (c) 2020</p>
	 * @author xx
	 * @date 2020年3月11日
	 * @param param the bare_field_name
	 * @return the bare_field_name
	 * @param pointLineChart
	 * @param name
	 * @param isx
	 * @return
	 * see_to_overridden
	 * @version 1.0
	 */
	private Axis createCategoryAxis(PointLineChart pointLineChart, String name, boolean isx) {
		Axis axis = null;
		if (isx)
			axis = pointLineChart.createXAxis(name, AxisType.category);
		else
			axis = pointLineChart.createYAxis(name, AxisType.category);

		// 创建一个map存储x轴的复杂属性的属性-值对
		Map<String, Object> axisTick = Maps.newHashMap();
		axisTick.put("interval", Integer.valueOf(0));

		axisTick.put("show", true);
		axisTick.put("grid", Position.left);
		axis.setPropValue("axisTick", axisTick);
		return axis;
	}
	
	/**
	 * Axis</br>
	 * 
	 * <p>Title: </p>
	 * <p>
	 *    Description:
	 * 创建值类型坐标轴
	 *
	 * @param name
	 *            坐标轴名称
	 * @param isX
	 *            是否X轴,ture创建X轴,false创建Y轴
	 * </p>
	 * <p>Copyright: Copyright (c) 2020</p>
	 * @author xx
	 * @date 2020年3月11日
	 * @param param the bare_field_name
	 * @return the bare_field_name
	 * @param pointLineChart
	 * @param name
	 * @param isx
	 * @return
	 * @version 1.0
	 */
	private Axis createValueAxis(PointLineChart pointLineChart, String name, boolean isx) {
		Axis axis = null;
		if (isx)
			axis = pointLineChart.createXAxis(name, AxisType.value);
		else
			axis = pointLineChart.createYAxis(name, AxisType.value);

		// 创建一个map存储y轴的复杂属性的属性-值对
		Map<String, Object> axisTick = Maps.newHashMap();
		axisTick.put("show", true);
		axis.setPropValue("axisTick", axisTick);

		// 创建一个map存储y轴的复杂属性的属性-值对
		Map<String, Object> splitLine = Maps.newHashMap();
		Map<String, Object> lineStyle = Maps.newHashMap();
		lineStyle.put("type", "dotted");
		lineStyle.put("color", "#E2E2E2");
		splitLine.put("lineStyle", lineStyle);
		axis.setPropValue("splitLine", splitLine);
		pointLineChart.setShowTooltip(true);
		return axis;
	}

	/**
	 * List<String></br>
	 * 
	 * <p>Title: </p>
	 * <p>
	 *    Description:
	 * </p>
	 * <p>Copyright: Copyright (c) 2020</p>
	 * @author xx
	 * @date 2020年3月11日
	 * @param param the bare_field_name
	 * @return the bare_field_name
	 * @return
	 * @version 1.0
	 */
	private List<String> contructCatetoryData() {

		// 此处需修改成实际分类数据,以下为案例数据
		List<String> categoryData = new ArrayList<>();
		categoryData.add("2019.1");
		categoryData.add("2019.2");
		categoryData.add("2019.3");
		categoryData.add("2019.4");
		categoryData.add("2019.5");
		categoryData.add("2019.6");
		return categoryData;
	};

	/**
	 * List<BigDecimal></br>
	 * 
	 * <p>Title: </p>
	 * <p>
	 *    Description:
	 * </p>
	 * <p>Copyright: Copyright (c) 2020</p>
	 * @author xx
	 * @date 2020年3月11日
	 * @param param the bare_field_name
	 * @return the bare_field_name
	 * @return
	 * @version 1.0
	 */
	private List<BigDecimal> contructValueData() {

		// 此处需添加实际数构建,以下为案例数据
		List<BigDecimal> valueData = new ArrayList<>();

		valueData.add(new BigDecimal(2566));
		valueData.add(new BigDecimal(1552));
		valueData.add(new BigDecimal(3786));
		valueData.add(new BigDecimal(2865));
		valueData.add(new BigDecimal(4098));
		valueData.add(new BigDecimal(7834));

		return valueData;
	}

	/**
	 * List<BigDecimal></br>
	 * 
	 * <p>Title: </p>
	 * <p>
	 *    Description:
	 * </p>
	 * <p>Copyright: Copyright (c) 2020</p>
	 * @author xx
	 * @date 2020年3月11日
	 * @param param the bare_field_name
	 * @return the bare_field_name
	 * @return
	 * @version 1.0
	 */
	private List<BigDecimal> contructValue2Data() {

		// 此处需添加实际数构建,以下为案例数据
		List<BigDecimal> valueData = new ArrayList<>();

		valueData.add(new BigDecimal(934));
		valueData.add(new BigDecimal(1035));
		valueData.add(new BigDecimal(2342));
		valueData.add(new BigDecimal(2274));
		valueData.add(new BigDecimal(5067));
		valueData.add(new BigDecimal(6654));

		return valueData;
	}

	/**
	 * void</br>
	 * 
	 * <p>Title: </p>
	 * <p>
	 *    Description:
	 *    创建折线
	 * </p>
	 * <p>Copyright: Copyright (c) 2020</p>
	 * @author xx
	 * @date 2020年3月11日
	 * @param param the bare_field_name
	 * @return the bare_field_name
	 * @param pointLineChart
	 * @param name
	 * @param values
	 * @param color
	 * see_to_overridden
	 * @version 1.0
	 */
	private void createLineSeries(PointLineChart pointLineChart, String name, List<BigDecimal> values, String color) {
		// 折线的名字
		LineSeries expireSeries = pointLineChart.createSeries(name);

		// 设置折线上文本的相关属性
		Label label = new Label();
		label.setShow(true);
		label.setColor("#000000");
		expireSeries.setLabel(label);

		// 连线颜色
		expireSeries.setItemColor(color);
		// 动画效果
		expireSeries.setAnimationDuration(2000);
		// 该点纵坐标的值setData(Number[] data)
		expireSeries.setData((Number[]) values.toArray(new Number[0]));
	}
}
  1. 重启服务器后注册插件预览测试,如下图所示测试成功

分割线


相关信息

以上就是我关于 金蝶云苍穹条形图样例 知识点的整理与总结的全部内容,希望对你有帮助。。。。。。

上次编辑于:
贡献者: 涎涎
评论
  • 按正序
  • 按倒序
  • 按热度
Powered by Waline v2.15.4