var pointLineChart = this.getControl("yama_pointlinechartap");
// 设置图的边距
pointLineChart.setMargin(kd.bos.form.chart.Position.right, "80px");
pointLineChart.setMargin(kd.bos.form.chart.Position.top, "80px");
pointLineChart.setMargin(kd.bos.form.chart.Position.left, "80px");
// 设置图例的位置
pointLineChart.setLegendPropValue("top", "8%");
// 设置图例中文字的字体大小和颜色等
var legendtextstyle = new HashMap();
legendtextstyle.put("fontSize", 18);
legendtextstyle.put("color", "#000000");
pointLineChart.setLegendPropValue("textStyle", legendtextstyle);
var axisX = pointLineChart.createXAxis('', kd.bos.form.chart.AxisType.category);
//var axisTick = new HashMap()
//axisTick.put('interval', 1)
//axisTick.put('show', false)
//axisX.setPropValue('axisTick', axisTick)
//var axisLineMap = new HashMap()
//var lineStyleMap = new HashMap()
//lineStyleMap.put('color', '#000000') //#f10a0a
//axisLineMap.put('lineStyle', lineStyleMap)
//axisX.setPropValue('axisLine', axisLineMap)
// 设置分类轴名称位置属性,end表示在最后
//axisX.setPropValue("nameLocation", "end");
var axisY = pointLineChart.createYAxis("千(元)", kd.bos.form.chart.AxisType.value);
var axisYLineMap = new HashMap()
var lineYStyleMap = new HashMap()
lineYStyleMap.put('color', '#000000') //#f10a0a
axisYLineMap.put('lineStyle', lineYStyleMap)
axisY.setPropValue('axisLine', axisYLineMap)
// 此处需修改成实际分类数据,以下为案例数据
var 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");
axisX.setCategorys(categoryData);
// 折线的名字
var es = pointLineChart.createSeries( "A公司销售额");
// 连线颜色
es.setItemColor("#F4A460");
//设置是否曲线 true 曲线 不设置是折线
//es.setSmooth(true)
es.setYAxisIndex(0)
//var items = new java.util.ArrayList()
//var item1 = new kd.bos.form.chart.GradientItem()
//item1.setOffset(0)
//item1.setColor('#2BBFC1')
//items.add(item1)
//var item2 = new kd.bos.form.chart.GradientItem()
//item2.setOffset(1)
//item2.setColor('#d6f3f2')//
//items.add(item2)
//es.setAreaColor(0, 0, 0, 1, items)
//es.setItemColor('#39bdb9')//
// 动画效果
//es.setAnimationDuration(2000);
// 此处需添加实际数构建,以下为案例数据
var valueData = new ArrayList();
valueData.add(toBigDecimal(8));
valueData.add(toBigDecimal(42));
valueData.add(toBigDecimal(14));
valueData.add(toBigDecimal(52));
valueData.add(toBigDecimal(12));
valueData.add(toBigDecimal(47));
// 该点纵坐标的值setData(Number[] data)
for (var i=0; i<valueData.size(); i++){
es.addData(toDouble(valueData.get(i)));
}
金蝶云苍穹 点线图控件
最新推荐文章于 2021-05-13 14:26:19 发布