若依前后端不分离Echarts饼状图、折线图、地图写法。。。。。。

本文链接：https://blog.youkuaiyun.com/qq_45811302/article/details/132103696

Controller

@Controller
@RequestMapping("/system/image")
public class EchartsController extends BaseController
{
    private String prefix = "system/state";

    @Autowired
    private IEchartsService echartsService;

    @GetMapping()
    public String image()
    {
        return prefix + "/image";
    }


    //查询全部
    @PostMapping("/list")
    @ResponseBody
    public TableDataInfo list()
    {
        startPage();// 此方法配合前端完成自动分页
        List<Echarts> list = echartsService.findAll();
        return getDataTable(list);
    }


    //查询全部
    @PostMapping("/listditu")
    @ResponseBody
    public TableDataInfo map()
    {
        startPage();// 此方法配合前端完成自动分页
        List<Echarts> list = echartsService.map();
        return getDataTable(list);
    }

}

Service

public interface IEchartsService {

    List<Echarts> findAll();

    public List<Echarts> map();
}

Service实现类

@Service
public class IEchartsServiceImpl implements IEchartsService {

    @Autowired
    private EchartsMapper echartsMapper;


    @Override
    public List<Echarts> findAll() {
        return echartsMapper.findAll();
    }

    @Override
    public List<Echarts> map() {
        return echartsMapper.map();
    }

}

Mapper

public interface EchartsMapper {

    public List<Echarts> findAll();

    public List<Echarts> map();

}

XML很简单，大家自己写就可以了这里就不展示了...........

页面

<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('可视化列表')"/>
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-6">
            <div class="ibox float-e-margins">