Spring Boot笔记-echarts的使用及数据的修改

目录

 

基本概念

代码及演示

---

 

基本概念

这里2D的一般使用这个js文件：echarts.js

3D的一般使用这个js文件：echarts-gl.min.js

thymeleaf这个模版引擎，可以返回一个div，如下所示：

    //刷新雷达图
    @GetMapping("/refreshRadarGraph/{value}")
    public String refreshRadarGraph(@PathVariable("value") Integer value, Model model){

        ...
        ...
        ...
        return "admin/radarGraph::flush";
    }

通过::XXX，可以直接返回这一部分的数据。前端可以使用jQuery中的load()函数进行异步调用！

就可以实现局部替换。

JavaScript如下：

显示如下：

通过：[[${someInfo.get(0)}]]这种方式可以获取后端的数据！

记得设置如下：

后端代码如下：

    //雷达图
    @GetMapping("/radar")
    public String toRadarGraphPage(Model model){

        List list = new ArrayList<>();
        list.add(4000);
        model.addAttribute("someInfo", list);
        return "admin/radarGraph";
    }

    //刷新雷达图
    @GetMapping("/refreshRadarGraph/{value}")
    public String refreshRadarGraph(@PathVariable("value") Integer value, Model model){

        System.out.println("refreshRadarGraph called the value is  : " + value);
        List list = new ArrayList<>();
        list.add(value);
        model.addAttribute("someInfo", list);
        return "admin/radarGraph::flush";
    }