应用场景
苍穹图表控件相比echart支持的类型少了很多，很多常用的echart图形通过苍穹无法快速的实现，使用者只能自己构造数据结构调用原生的指令，实现难度很大。本文将介绍如何通过通用图构造各种echart支持的图形。
具体操作步骤如下：
1、在设计器拖一个通用图控件
2、插件中获取到chart控件
```
Chart chart = getControl("customchartap");
```
3、通过chart控件生成通用系列series，并设置系列的类型
```
Series series = chart.createCustomSeries("通用图");
```
**//此处也可以用这个万能的方法设置系列的其他属性**
```
series.setPropValue("type","echart图的类型，如：gauge")
```
4、可以利用chart控件提供的万能方法添加其他属性
**chart.addProperty("属性名", "属性值");**
5、通过chart控件的bingdata方法发送指令到前端渲染页面
```
chart.bindData(null);
```
参考代码:
```
Control gaugeChart = getControl("gaugechartap");
if(gaugeChart instanceof GaugeChart){
GaugeChart chart = (GaugeChart)gaugeChart;
GaugeSeries series = chart.createSeries(ResManager.loadKDString("业务指标", "ChartPlugin_3", BOS_FORM_BUSINESS));
Map<String, Object> map = new HashMap<String, Object>();
map.put("formatter", "{value}%");
series.setDetail(map);
series.addData(new ItemValue(ResManager.loadKDString("完成率", "ChartPlugin_4", BOS_FORM_BUSINESS), 45));
chart.bindData(null);
}
```
*注：也可以完全不借助苍穹系统提供的方法，自己按照echart图形的样式组织数据，通过发送前端指令的方法渲染图形，此方案不要写在afterbinddata方法中，因为平台后续还会调用一次binddata方法会覆盖掉之前的指令*
```
//series:[{data: [{name: "完成率", value: 45}], name: "业务指标", detail: {formatter: "{value}%"}, type: "gauge"}]
Control customChart = getControl("customchartap");
Map<String, Object> result = new HashMap<>();
List<Map<String, Object>> seriesList = new ArrayList<>();
Map<String, Object> seriesMap = new HashMap<>();
List<Map<String, Object>> dataList = new ArrayList<>();
Map<String, Object> dataMap = new HashMap<>();
dataMap.put("name", "完成率");
dataMap.put("value", 45);
dataList.add(dataMap);
seriesMap.put("data", dataList);
seriesMap.put("name", "业务指标");
Map<String, Object> detailMap = new HashMap<>();
detailMap.put("formatter", "{value}%");
seriesMap.put("detail", detailMap);
seriesMap.put("type", "gauge");
seriesList.add(seriesMap);
result.put("series", seriesList);
//title: {x: "left", y: "top", text: "仪表盘"}
Map<String, Object> titleMap = new HashMap<>();
titleMap.put("x", "left");
titleMap.put("y", "top");
titleMap.put("text", "仪表盘");
result.put("title", titleMap);
IClientViewProxy clientViewProxy = getView().getService(IClientViewProxy.class);
clientViewProxy.setFieldProperty(customChart.getKey(), "data", result);
```
