ecahrts实现动态刷新(隔几秒重新显示)

代码:

<script>
    var chartDom = document.getElementById('main3');
    var myChart = echarts.init(chartDom);
    var option;

    window.onload = function () {
        getSpider();
    }
    window.setInterval(getSpider, 5000);// 每5s请求一次
    function getSpider() {
        var result = [];
        var x = []
        var y = []
        $.ajax({
            url: "spider",
            type: "POST",
            dataType: "json",
            async: false,
            success: function (data) {
                result = data

            }
        });
        for (var i = 0; i < result.length; i++) {
            x.push(result[i].spider_time)
            y.push(result[i].number)
        }
        console.log(x)
        option = {
            title: {
                text: '实时评论量(动态)',
                subtext: '单位 条'
            },
            tooltip: {
                trigger: 'axis'
            },
            legend: {},
            toolbox: {
                show: true,
                feature: {
                    dataZoom: {
                        yAxisIndex: 'none'
                    },
                    dataView: {readOnly: false},
                    magicType: {type: ['line', 'bar']},
                    restore: {},
                    saveAsImage: {}
                }
            },
            xAxis: {
                type: 'category',
                boundaryGap: false,
                data: x
            },
            yAxis: {
                type: 'value'
            },
            series: [
                {
                    type: 'line',
                    data: y,
                    markPoint: {
                        data: [
                            {type: 'max', name: 'Max'},
                            {type: 'min', name: 'Min'}
                        ]
                    },
                    markLine: {
                        data: [{type: 'average', name: 'Avg'}]
                    }
                }
            ]
        };

        option && myChart.setOption(option);
    }
</script>

servlet代码：

package cn.itcast.servlet;

import cn.itcast.bean.Days;
import cn.itcast.bean.Spider;
import cn.itcast.dao.DaysDao;
import cn.itcast.dao.SpiderDao;
import com.google.gson.Gson;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.util.List;

public class SpiderServlet extends HttpServlet {
    private SpiderDao spiderDao =new SpiderDao();
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        doPost(req, resp);
    }

    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        req.setCharacterEncoding("UTF-8");
        resp.setCharacterEncoding("UTF-8");
        Gson gson = new Gson();
        List<Spider> list=spiderDao.getSpider();
        resp.getWriter().write(gson.toJson(list));
    }
}

生成效果: