【ECharts-DataGrid】鼠标单击事件显示详细信息

一、功能描述

       在ECharts中可以直观的显示对数据库中信息的统计结果，但是ECharts处理只能看到数据的处理结果而不能看到，统计出来的数据详细信息。

       本篇博客主要实现点击ECharts的统计信息时候，显示统计出该数据的详细信息。可结合以前的一篇博客进行理解：https://blog.csdn.net/wilson_m/article/details/78804153。

二、前台代码

//数据网格，用于展示Echarts统计的详细信息，默认不显示
 <div  id="window1" class="easyui-window" title="详细数据信息" style="width: 80%;height: 80%"  data-options="closed:true,minimizable:false,collapsible:false">
        <table  id="dg1" class="easyui-datagrid"
                data-options="
               method:'get',
               border:false,
               singleSelect:true,
               fit:true,
               collapsible:false,
               pagination:true,
               fitColumns:true">
            <thead>
            <tr>
                <th data-options="field:'traintype', align:'center',width:'9%'">培训类型</th>
                <th data-options="field:'trainNo', align:'center',width:'10%'">培训编号</th>
                <th data-options="field:'trainYear', align:'center',width:'10%'">培训年份</th>
                <th data-options="field:'traincontent',align:'center',width:'9%'">培训内容</th>
                <th data-options="field:'trainAddress',align:'center',width:'9%'">培训地点</th>
                <th data-options="field:'trainHours', align:'center',width:'5%'">学时</th>
                <th data-options="field:'teacherGender', align:'center',width:'9%'">性别</th>
                <th data-options="field:'workUnit', align:'center',width:'9%'">工作单位</th>
                <th