json通过后台获取数据库中的内容，并在前端进行显示
fastjson.jar以及Echarts树图的js文件(需要在servlet对json进行赋值，所以需要用到json的插件)
链接：https://pan.baidu.com/s/1GBbamPNGTzKf2926Nkhczg
提取码：ukmg
用json主要目的就是需要用到一个Echars的树图，想要让他的数据从数据库中获取，所以要通过后台对json进行赋值
以下是源代码：
这是一个Echarts的一个前端的界面，这个可以在官网找到
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html style="height: 100%"> <head> <meta charset="utf-8"> </head> <body style="height: 100%; margin: 0"> <h2 align="center">企业分析族谱</h2> <div id="container" style="height: 80%"></div> <script type="text/javascript" src="js/echarts.js"></script> //你自己存放js的路径 <script type="text/javascript" src="js/dataTools"></script> <script type="text/javascript" src="js/jquery-3.3.1.js"></script> <script type="text/javascript"> var dom = document.getElementById("container"); var myChart = echarts.init(dom); var app = {}; var tempOption = {}; option = null; $.get('/company/ZuPuServlet', function(data) { //要获取值所用到的后台，由于初次接触，只会用一个后台去单独支持一个界面 $.each(data,function(name,chilren){ tempOption = chilren; }); myChart.setOption(option = { tooltip : { trigger : 'item', triggerOn : 'mousemove' }, series : [ { type : 'tree', data : [tempOption], top : '18%', bottom : '14%', layout : 'radial', symbol : 'emptyCircle', symbolSize : 7, initialTreeDepth : 3, animationDurationUpdate : 750 } ] }); }); ; if (option && typeof option === "object") { myChart.setOption(option, true); } </script> </body> </html>
这个是后台的代码：
package servlet; import java.io.IOException; import java.io.UnsupportedEncodingException; import java.util.ArrayList; import java.util.List; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import javax.servlet.http.HttpSession; import javax.websocket.Session; import com.alibaba.fastjson.JSON; import com.alibaba.fastjson.JSONArray; import com.alibaba.fastjson.JSONObject; import com.mysql.jdbc.EscapeTokenizer; import bean2.T_corp; import bean2.T_corp_dist; import bean2.T_corp_stock; import bean2.T_m_corp_corp_dist; import bean2.T_m_corp_corp_stock; import dao.Guquan; import dao.T_CORP_Dao; import dao.T_corp_distDao; import dao.T_corp_stockDao; import dao.ZuPu; /** * Servlet implementation class ZuPuServlet */ @WebServlet("/ZuPuServlet") public class ZuPuServlet extends HttpServlet { private static final long serialVersionUID = 1L; private static final String EscapeTokenizer = null; /** * @see HttpServlet#HttpServlet() */ public ZuPuServlet() { super(); // TODO Auto-generated constructor stub } /** * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response) */ protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub //response.getWriter().append("Served at: ").append(request.getContextPath()); request.setCharacterEncoding("UTF-8"); HttpSession session = request.getSession(); String name =(String)session.getAttribute("name"); //通过session获取公司的名称 System.out.println(name); T_corp t_corp = T_CORP_Dao.getByName(name); List<T_m_corp_corp_stock> list = Guquan.list1(t_corp); //有某一公司获取到相应的股东关系 List<T_m_corp_corp_dist> list1 = ZuPu.list1(t_corp); //获取对应的分支公司 List<T_corp_stock> tStocks = new ArrayList<>(); List<T_corp_dist> tDists = new ArrayList<>(); T_corp_stock tStock ; T_corp_dist tDist ; JSONObject json1 = new JSONObject(); //用来处理最中间的主节点 JSONArray arry1 = new JSONArray(); JSONArray arry2 = new JSONArray(); //存放各个股东的信息 JSONArray arry3 = new JSONArray(); //存放各个分公司的数据 JSONArray htags = new JSONArray(); //由主节点扩展的分支节点 JSONObject second1 = new JSONObject(); JSONObject second2 = new JSONObject(); json1.put("name",t_corp.getCORP_NAME());//将公司名赋值给第一个主节点 for(int i = 0; i < list.size();i++) { tStock = T_corp_stockDao.getstock(list.get(i).getSUB_ORG(), list.get(i).getSUB_ID(), list.get(i).getSUB_SEQ_ID()); tStocks.add(tStock); JSONObject json2 = new JSONObject(); //处理代表股权的节点信息 json2.put("name", tStock.getSTOCK_NAME()); arry2.add(json2); } for(int i =0; i < list1.size() ; i++) { tDist = T_corp_distDao.getstock(list1.get(i).getSUB_ORG(), list1.get(i).getSUB_ID(), list1.get(i).getSUB_SEQ_ID()); tDists.add(tDist); JSONObject json3 = new JSONObject(); //处理代表公司分支的信息 json3.put("name", tDist.getDIST_NAME()); System.out.println(tDist.getDIST_NAME()); arry3.add(json3); } second2.put("name", "对外投资"); second1.put("name", "股东"); second1.put("children", arry2); second2.put("children", arry3); arry1.add(second1); arry1.add(second2); json1.put("children", arry1); System.out.println("获取数据"); response.setContentType("application/json"); response.setCharacterEncoding("utf-8"); htags.add(json1); response.getWriter().write(htags.toJSONString()); session.invalidate(); } /** * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response) */ protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub doGet(request, response); } }
最终的效果是这样的
第一次接触这个东西写的有点乱不太好理解，不喜勿喷
