Java程序定时输出图表

使用的技术：Quartz调度器+Echarts

1. Quartz调度器

Quartz简介

Quartz是一个完全由java编写的开源作业调度框架。尽管Quartz框架整合了许多额外功能，但就其简易形式看，简单地创建一个实现org.quartz.Job接口的java类即可。Job接口包含唯一的方法：

public void execute(JobExecutionContext context) throws JobExecutionException;

在Job接口实现类里面，添加一些逻辑到execute()方法。一旦配置好Job实现类并设定好调度时间表，Quartz将密切注意剩余时间。当调度程序确定该是通知你的作业的时候，Quartz框架将调用你Job实现类（作业类）上的execute()方法并允许做它该做的事情。无需报告任何东西给调度器或调用任何特定的东西。仅仅执行任务和结束任务即可。如果配置你的作业在随后再次被调用，Quartz框架将在恰当的时间再次调用它。

Quartz使用步骤

使用包含3个步骤：

JobDetail：告诉调度器要做什么。
Trigger：告诉调度器什么时候做。
Scheduler：准备妥了就从这里start

写一个类实现Job接口，重写execute()方法，在该方法中写要执行的逻辑。

public class UpdateProductJob implements Job{

    @Override
    public void execute(JobExecutionContext jobExecutionContext) throws JobExecutionException {
        try {
            System.out.print("我来检查啦")
        }catch (Exception e){
            System.out.println(e);
        }
    }
}

然后在xml中进行配置：

<!--quartz-->
    <bean id="jobDetail" class="org.springframework.scheduling.quartz.JobDetailFactoryBean">
        <property name="jobClass" value="com.config.quartz.UpdateProductJob"></property>
    </bean>
<!--执行时间表达方式一-->
    <!--<bean id="simpleTrigger" class="org.springframework.scheduling.quartz.SimpleTriggerFactoryBean">-->
        <!--<property name="jobDetail" ref="jobDetail"></property>-->
        <!--<property name="startDelay" value="10000"></property>&lt;!&ndash;延迟10s&ndash;&gt;-->
        <!--<property name="repeatInterval" value="5000"></property>-->
    <!--</bean>-->
<!--执行时间表达方式二-->
    <bean id="cronTrigger" class="org.springframework.scheduling.quartz.CronTriggerFactoryBean">
        <property name="jobDetail" ref="jobDetail" />
        <property name="cronExpression" value="0 59 23 ? * *" />
    </bean>

    <bean id="scheduler" class="org.springframework.scheduling.quartz.SchedulerFactoryBean">
        <property name="triggers">
            <list>
                <ref bean="cronTrigger"/>
            </list>
        </property>
    </bean>

simpleTrigger和cronTrigger是两种表达执行时间的方式。启动后即可按照定义的时间表达式自动触发任务。

2. Echarts

Echarts定义

Echarts是一个纯 Javascript 的图表库，可以流畅的运行在 PC 和移动设备上，兼容当前绝大部分浏览器（IE8/9/10/11，Chrome，Firefox，Safari等），底层依赖轻量级的 Canvas 类库 ZRender，提供直观，生动，可交互，可高度个性化定制的数据可视化图表。

Echarts特点

ECharts 属于开源软件，并且我们提供了非常炫酷的图形界面，特色是地图，另外还提供了柱状图、折线图、饼图、气泡图及四象限图等；
ECharts 使用简单，在官网中为我们封装了 JS，只要会引用就会得到完美的展示效果；
ECharts 种类多，ECharts 实现简单，各类图形都有；相应的模板，还有丰富的 API 及文档说明，非常详细；
ECharts 兼容性好，基于HTML5，有着良好的动画渲染效果。

Echarts快速上手

ECharts 的引入方式就可以像 JavaScript 库一样用 script 标签引入即可。

下面是 Echarts 引入的代码：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <!-- 引入 ECharts 文件 -->
    <script src="echarts.min.js"></script>
</head>
</html>

一个简单的柱状图样例：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>ECharts</title>
    <!-- 引入 echarts.js -->
    <script src="echarts.min.js"></script>
</head>
<body>
    <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
    <div id="main" style="width: 600px;height:400px;"></div>
    <script type="text/javascript">
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('main'));

        // 指定图表的配置项和数据
        var option = {
            title: {
                text: 'ECharts 入门示例'
            },
            tooltip: {},
            legend: {
                data:['销量']
            },
            xAxis: {
                data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
            },
            yAxis: {},
            series: [{
                name: '销量',
                type: 'bar',
                data: [5, 20, 36, 10, 10, 20]
            }]
        };

        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
    </script>
</body>
</html>

在这里插入图片描述

Echarts实现异步数据加载与更新

ECharts 由数据驱动，数据的改变驱动图表展现的改变，因此动态数据的实现也变得异常简单。
Echarts 中通过 setOption 更新所有的数据，我们要做的只是定时获取数据，然后使用 setOption 填入数据，至于数据在过程中发生了哪些变化，不在我们的考虑范围内。
ECharts 会找到两组数据之间的差异然后通过合适的动画去表现数据的变化。
代码示例：

var base = +new Date(2014, 9, 3);

var oneDay = 24 * 3600 * 1000;

var date = [];

var data = [Math.random() * 150];

var now = new Date(base);

function addData(shift) {

    now = [now.getFullYear(), now.getMonth() + 1, now.getDate()].join('/');

    date.push(now);

    data.push((Math.random() - 0.4) * 10 + data[data.length - 1]);

    if (shift) {

        date.shift();

        data.shift();

    }

    now = new Date(+new Date(now) + oneDay);

}

for (var i = 1; i < 100; i++) {

    addData();

}

option = {

    xAxis: {

        type: 'category',

        boundaryGap: false,

        data: date

    },

    yAxis: {

        boundaryGap: [0, '50%'],

        type: 'value'

    },

    series: [

        {

            name:'成交',

            type:'line',

            smooth:true,

            symbol: 'none',

            stack: 'a',

            areaStyle: {

                normal: {}

            },

            data: data

        }

    ]

};

setInterval(function () {

    addData(true);

    myChart.setOption({

        xAxis: {

            data: date

        },

        series: [{

            name:'成交',

            data: data

        }]

    });

}, 500);

来源：CSDN

作者：hblack_313

链接：https://blog.csdn.net/hblack_313/article/details/104250581

标签

quartz