Java后端写vue前端需要的扇形图与柱状图的接口（springBoot+jpa+前端Vue）

数据结构效果图(后端最终数据结构结果)：

{
“success”: true,
“code”: 20000,
“msg”: null,
“data”: {
“thisYear”: {
“pieChartData”: {
“data”: [
{
“value”: 5982071.08,
“name”: “化石燃料”
},
{
“value”: 3592.12,
“name”: “脱硫剂”
},
{
“value”: 470000,
“name”: “电力”
}
]
},
“barchartDate”: {
“fossilFuelType”: [ 239166.98,478333.95,717500.97, 119583.51,239166.98,597917.45,956667.93,1195834.9,478333.95,321822.92,637741.54, 940634.52 ],
“desulfurizer”: [ 239166.98,478333.95,717500.97, 119583.51,239166.98,597917.45,956667.93,1195834.9,478333.95,321822.92,637741.54, 940634.52 ],
“power”: [ 239166.98,478333.95,717500.97, 119583.51,239166.98,597917.45,956667.93,1195834.9,478333.95,321822.92,637741.54, 940634.52 ]
}
},
“lastYear”: {
“pieChartData”: {
“data”: [
{
“value”: 5982071.08,
“name”: “化石燃料”
},
{
“value”: 3592.12,
“name”: “脱硫剂”
},
{
“value”: 470000,
“name”: “电力”
}
]
},
“barchartDate”: {
“fossilFuelType”: [ 239166.98,478333.95,717500.97, 119583.51,239166.98,597917.45,956667.93,1195834.9,478333.95,321822.92,637741.54, 940634.52 ],
“desulfurizer”: [ 239166.98,478333.95,717500.97, 119583.51,239166.98,597917.45,956667.93,1195834.9,478333.95,321822.92,637741.54, 940634.52 ],
“power”: [ 239166.98,478333.95,717500.97, 119583.51,239166.98,597917.45,956667.93,1195834.9,478333.95,321822.92,637741.54, 940634.52 ]
}
},
“beforeYear”: {
“pieChartData”: {
“data”: [
{
“value”: 5982071.08,
“name”: “化石燃料”
},
{
“value”: 3592.12,
“name”: “脱硫剂”
},
{
“value”: 470000,
“name”: “电力”
}
]
},
“barchartDate”: {
“fossilFuelType”: [ 239166.98,478333.95,717500.97, 119583.51,239166.98,597917.45,956667.93,1195834.9,478333.95,321822.92,637741.54, 940634.52 ],
“desulfurizer”: [ 239166.98,478333.95,717500.97, 119583.51,239166.98,597917.45,956667.93,1195834.9,478333.95,321822.92,637741.54, 940634.52 ],
“power”: [ 239166.98,478333.95,717500.97, 119583.51,239166.98,597917.45,956667.93,1195834.9,478333.95,321822.92,637741.54, 940634.52 ]
}
},
“totalElements”: 0,
“totalPage”: 0
}

扇形

• 这里的barchartDate实体类就是写的柱状图
• 这里fossilFuelType & desulfurizer & power是barchartDate实体类中的变量（字段）

柱状

• 这里的pieChartData实体类就是写的扇形图的数据，data是他的变量
• 这里的value & name是实体类data中的变量（字段）

总结

• 实体类套实体类
• 最后整个的这个接口又是个实体类里面包含着三个字段：thisYear，lastYear， beforeYear这三个字段的类型是同一个实体类泛型
• 下来不懂就看代码吧(^_)！（看一遍实体类就应该懂了）
• 数据结构中展示的文字是实体类中的变量名例如：lastYear这样的就是实体类中的变量名

---

代码

model层

// BarchartDate 类
package com.mqdl.Calculate.ComputationService.model.threeshuju;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import lombok.extern.slf4j.Slf4j;

@Data
@NoArgsConstructor
@AllArgsConstructor
@Slf4j
public class BarchartDate {
   double[] fossilFuelType;
   double[] desulfurizer;
   double[] power;
}

// SectorDTo类
package com.mqdl.Calculate.ComputationService.model.threeshuju;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import lombok.extern.slf4j.Slf4j;
import java.util.List;
@Data
@NoArgsConstructor
@AllArgsConstructor
@Slf4j
public class SectorDTo {
   List<ValueAndNameDTO> data;
}

// ThreeYearDTO类
package com.mqdl.Calculate.ComputationService.model.threeshuju;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import lombok.extern.slf4j.Slf4j;
@Data
@NoArgsConstructor
@AllArgsConstructor
@Slf4j
public class ThreeYearDTO {
   YearDTO thisYear;
   YearDTO lastYear;
   YearDTO beforeYear;
}

// ValueAndNameDTO类
package com.mqdl.Calculate.ComputationService.model.threeshuju;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import lombok.extern.slf4j.Slf4j;

@Data
@NoArgsConstructor
@AllArgsConstructor
@Slf4j
public class ValueAndNameDTO{
   double value;
   String name;
}

// YearDTO 类
package com.mqdl.Calculate.ComputationService.model.threeshuju;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import lombok.extern.slf4j.Slf4j;

@Data
@NoArgsConstructor
@AllArgsConstructor
@Slf4j
public class YearDTO {
   BarchartDate BarchartDate;
   SectorDTo PieChartData;
}

• service曾我就不展示了主要是写的赋值过程

• Controller层

package com.mqdl.Calculate.ComputationService.controller.threeYearData;
import com.mqdl.Calculate.ComputationService.model.threeshuju.ThreeYearDTO;
import com.mqdl.Calculate.ComputationService.service.Statistical_chart_data.ScdService;
import com.zgy.handle.common.response.ResponseCode;
import lombok.extern.slf4j.Slf4j;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
@RestController
@Slf4j
@RequestMapping(value = "threeyeardata/query")
public class ThreeYearDataQueryController {
    @Autowired
    ScdService scdService;//引用的Service层
    @GetMapping(value = "findThreeYearData")
    public ResponseCode<ThreeYearDTO> findThreeYearData(){
        ResponseCode<ThreeYearDTO> responseCode=ResponseCode.sucess();
        responseCode.setData(scdService.getzhuxignAndshanxin());
        return responseCode;
    }
}

//repository 柱形图数据处理层
package com.mqdl.Calculate.ComputationService.repository.monthsummary;

import com.mqdl.Calculate.ComputationService.model.monthsummary.MonthSummary;
import com.mqdl.Calculate.ComputationService.repository.base.QueryRepository;
import org.springframework.data.jpa.repository.Query;
import org.springframework.data.repository.query.Param;
import org.springframework.stereotype.Repository;

import java.util.List;

@Repository
public interface MonthSummaryQueryRepository extends QueryRepository<MonthSummary> {
    @Query(nativeQuery = true,value = "select * from system_monthsummary where monthTime LIKE %:createtime% ")
    List<MonthSummary> selectfossilFuelEmissions(@Param("createtime") String createTime);
    @Query(nativeQuery = true,value = "select * from system_monthsummary where monthTime LIKE %:createtime% ")
    List<MonthSummary> selectdesulphurizationEmissions(@Param("createtime") String createTime);
    @Query(nativeQuery = true,value = "select * from system_monthsummary where monthTime LIKE %:createtime% ")
    List<MonthSummary> selectelectricEmissions(@Param("createtime") String createTime);
}

//repository 扇形图数据处理层
package com.mqdl.Calculate.ComputationService.repository.yearsummary;

import com.mqdl.Calculate.ComputationService.model.yearsummary.YearSummary;
import com.mqdl.Calculate.ComputationService.repository.base.QueryRepository;
import org.springframework.data.jpa.repository.Query;
import org.springframework.data.repository.query.Param;
import org.springframework.stereotype.Repository;

import java.util.List;

@Repository
public interface YearSummaryQueryRepository extends QueryRepository<YearSummary> {
    @Query(nativeQuery = true,value = "select * from system_yearsummary where yearTime LIKE %:createtime% ")
    YearSummary selectfossilFuelEmissions(@Param("createtime") String createTime);
    @Query(nativeQuery = true,value = "select * from system_yearsummary where yearTime LIKE %:createtime% ")
    YearSummary selectdesulphurizationEmissions(@Param("createtime") String createTime);
    @Query(nativeQuery = true,value = "select * from system_yearsummary where yearTime LIKE %:createtime% ")
    YearSummary selectelectricEmissions(@Param("createtime") String createTime);
}

好的话点个赞吧，这里Service也准备好了加个关注去我的主页里找吧！！