开发指南102-datav的利用

官网地点：DataV
团体思路：
datav的设计有个问题，各个类型的图数据布局差别。假如让前端做数据转换会很麻烦。所以要求后端返回前端所需布局。具体布局看官网。
前端：
main.js中新增
import DataV from '@jiaminghi/data-view'
Vue.use(DataV)
引入DavaV for vue
前端写法很简朴：
<dv-charts ption="retData" />
无需关心格式，都由背景来处理。
背景：
  <groupId>org.qlm</groupId>
    <artifactId>qlm-dto-dvchart</artifactId>
    <version>1.0-SNAPSHOT</version>
饼图
        dvresultDto result = new dvresultDto();
        dvtitleDto title = new dvtitleDto();
        title.setText("标题");
        result.setTitle(title);
        List<seriesDto> series = new ArrayList<>();
        seriesDto aseries = new seriesDto();
        aseries.setType("pie");
        insideLabelDto inside = new insideLabelDto();
        inside.setShow(true);
        aseries.setInsideLabel(inside);
        aseries.setAnimationCurve("easeOutBack");
        List<dvdataDto> list = new ArrayList<>();
         while (遍历组装数据){
            dvdataDto a = new dvdataDto();
            a.setName("名称");
            a.setValue(数据);
            list.add(a);
        }
        aseries.setData(list);
        series.add(aseries);
        result.setSeries(series);
柱状图

        dvresult2DtoV result = new dvresult2DtoV();
        dvtitleDto title = new dvtitleDto();
        title.setText("标题");
        result.setTitle(title);
        dvaxis2Dto xaxis = new dvaxis2Dto();
        List<String> xDate = new ArrayList<>();
        xaxis.setName(year + "年度");
        dvaxis1Dto yaxis = new dvaxis1Dto();
        yaxis.setName("场次");
        yaxis.setData("value");
        List<series2Dto> series = new ArrayList<>();
        series2Dto series2Dto = new series2Dto();
        series2Dto.setType("bar");
        // 组装信息
        List<String> xDate = new ArrayList<>();
        List<Integer> numbers = new ArrayList<>();
        // 组装数据
        series2Dto.setData(numbers);
        series.add(series2Dto);
        xaxis.setData(xDate);
        result.setXAxis(xaxis);
        result.setYAxis(yaxis);
        result.setSeries(series);

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。