Untitled

<!DOCTYPE html>

<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <meta name="robots" content="noindex, nofollow">
  <meta name="googlebot" content="noindex, nofollow">

  <script type="text/javascript" src="/js/lib/dummy.js"></script>

    <link rel="stylesheet" type="text/css" href="/css/result-light.css">

  <style type="text/css">

  </style>

  <title>An Example of a Google Bar Chart</title>

</head>

<body>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
  <div id="chart_div"></div>


<script type='text/javascript'>//<![CDATA[

google.charts.load('current', {packages: ['corechart', 'line']});
google.charts.setOnLoadCallback(drawBasic);

            var queryObject="";
            var queryObjectLen="";
            $.ajax({
                type : 'POST',
                url : 'getdata2.jsp',
                dataType:'json',
                success : function(data) {
                    queryObject = eval('(' + JSON.stringify(data) + ')');
                    queryObjectLen = queryObject.empdetails.length;
                },
                    error : function(xhr, type) {
                    alert('server error occoured');
                }
            });
            google.load("visualization", "1", {packages:["corechart"]});
            google.setOnLoadCallback(drawChart);
          function drawBasic() {

       var data = new google.visualization.DataTable();

                data.addColumn('number', 'name');
                data.addColumn('number', 'id');


                for(var i=0;i<queryObjectLen;i++){

                    var name = ParseInt(queryObject.empdetails[i].name);
                    var id = ParseInt(queryObject.empdetails[i].id);

                    data.addRows([
                       [name,id]
                    ]);

                }

      var options = {
        hAxis: {
          title: 'Time'
        },
        vAxis: {
          title: 'Popularity'
        }
      };

      var chart = new google.visualization.LineChart(document.getElementById('chart_div'));

      chart.draw(data, options);
    }
        </script>
        </head>
        <body>
              <div id="chart_div"></div>
         </body>
        </html>

<%@page import="java.sql.*" %>
  <%@page import="java.util.*" %>
  <%@page import="org.json.JSONObject" %>

<%
    Connection con= null;
 try{
  Class.forName("com.mysql.jdbc.Driver").newInstance();
 con = DriverManager.getConnection("jdbc:mysql://localhost:3306/java","root","1234");

        ResultSet rs = null;
        List empdetails = new LinkedList();
        JSONObject responseObj = new JSONObject();

        String query = "SELECT * from consumo";
          PreparedStatement pstm= con.prepareStatement(query);

           rs = pstm.executeQuery();
           JSONObject empObj = null;

        while (rs.next()) {
            int name = rs.getInt("working_days");
            //int empid = rs.getInt("id");
            int id = rs.getInt("id");

            empObj = new JSONObject();

            empObj.put("name", name);
            //empObj.put("empid", empid);
            empObj.put("id", id);

            empdetails.add(empObj);
        }
        responseObj.put("empdetails", empdetails);
    out.print(responseObj.toString());
    }
    catch(Exception e){
        e.printStackTrace();
    }finally{
        if(con!= null){
            try{
            con.close();
            }catch(Exception e){
                e.printStackTrace();
            }
        }
    }
 %>

{"empdetails":[{"name":20,"id":45},{"name":30,"id":100},{"name":50,"id":150},{"name":10,"id":500},{"name":15,"id":600}]}