Home forums Using CanvasJS sprint mvc pie chart

This topic contains 6 replies, has 3 voices, and was last updated by  DilrukshiRajapakshe 3 months ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #22631

    I want show my two table data in one chart i used get the db data on service class.i get data in stored arrylist. and i call it my controller but i dont know how to that data pass the my jsp file that is problem. i do corde for my jsp file pleas cheak the error please give me solution it. i am sorry for bother you
    This my controller class cord

    else if(val.equals(“Reports”)){
    ViewClass v = new ViewClass();
    v.setSt(val);
    Report re = new Report();
    ArrayList list1 = re.StockReportDisplay(v);
    System.out.println(list1);
    ArrayList list2 = re.DamageReportDisplay(v);
    System.out.println(list2);
    ArrayList list3 = re.SNonAvailableItemReportDisplay(v);
    System.out.println(list3);
    ArrayList list4 = re.RetutnItemReportDisplay(v);
    System.out.println(list4);
    ArrayList list5 = re.RepairedItemReportDisplay(v);
    System.out.println(list5);
    ArrayList list6 = re.NonRepairedItemReportDisplay(v);
    ArrayList list = null;
    ArrayList listView = new ArrayList();
    list.add(list1);
    list.add(list2);
    list.add(list3);
    list.add(list4);
    list.add(list5);
    list.add(list6);
    listView.add(list);
    System.out.println(list6);
    mv.setViewName(“Report.jsp”);
    mv.addObject(“result”,listView);
    }

    this is my service class

    public class Report {
    Connection conn = null;
    public ArrayList StockReportDisplay(ViewClass view)throws ClassNotFoundException, SQLException {
    conn = (Connection)DBconnectionSingleton.conn();
    String query=”Select name,amount from stockitem where type=’Stock-item'”;
    String st = view.getSt();
    ArrayList al = null;
    ArrayList listView = new ArrayList();

    Statement sta = (Statement) conn.createStatement();
    ResultSet rs = sta.executeQuery(query);

    while (rs.next()) {
    al = new ArrayList();

    al.add(rs.getString(1));
    al.add(rs.getInt(2));

    listView.add(al);
    }

    conn.close();
    System.out.println(“Disconnected from database”);

    return listView;

    }
    public ArrayList DamageReportDisplay(ViewClass view)throws ClassNotFoundException, SQLException {
    conn = (Connection)DBconnectionSingleton.conn();
    String query=”Select name,amount from stockitem where type=’Damage-item'”;
    String st = view.getSt();
    ArrayList al = null;
    ArrayList listView = new ArrayList();

    Statement sta = (Statement) conn.createStatement();
    ResultSet rs = sta.executeQuery(query);

    while (rs.next()) {
    al = new ArrayList();

    al.add(rs.getString(1));
    al.add(rs.getString(2));

    listView.add(al);
    }

    conn.close();
    System.out.println(“Disconnected from database”);

    return listView;

    }
    public ArrayList SNonAvailableItemReportDisplay(ViewClass view)throws ClassNotFoundException, SQLException {
    conn = (Connection)DBconnectionSingleton.conn();
    String query=”Select name,amount from stockitem where type=’Stock-item’ and amount<=12″;
    String st = view.getSt();
    ArrayList al = null;
    ArrayList listView = new ArrayList();

    Statement sta = (Statement) conn.createStatement();
    ResultSet rs = sta.executeQuery(query);

    while (rs.next()) {
    al = new ArrayList();

    al.add(rs.getString(1));
    al.add(rs.getString(2));

    listView.add(al);
    }

    conn.close();
    System.out.println(“Disconnected from database”);

    return listView;

    }
    public ArrayList RetutnItemReportDisplay(ViewClass view)throws ClassNotFoundException, SQLException {
    conn = (Connection)DBconnectionSingleton.conn();
    String query=”Select name,amount from returnitem type=’Return-item'”;
    String st = view.getSt();
    ArrayList al = null;
    ArrayList listView = new ArrayList();

    Statement sta = (Statement) conn.createStatement();
    ResultSet rs = sta.executeQuery(query);

    while (rs.next()) {
    al = new ArrayList();

    al.add(rs.getString(1));
    al.add(rs.getString(2));

    listView.add(al);
    }

    conn.close();
    System.out.println(“Disconnected from database”);

    return listView;

    }
    public ArrayList RepairedItemReportDisplay(ViewClass view)throws ClassNotFoundException, SQLException {
    conn = (Connection)DBconnectionSingleton.conn();
    String query=”Select name,amount from returnitem type=’Reparing-item'”;
    String st = view.getSt();
    ArrayList al = null;
    ArrayList listView = new ArrayList();

    Statement sta = (Statement) conn.createStatement();
    ResultSet rs = sta.executeQuery(query);

    while (rs.next()) {
    al = new ArrayList();

    al.add(rs.getString(1));
    al.add(rs.getString(2));

    listView.add(al);
    }

    conn.close();
    System.out.println(“Disconnected from database”);

    return listView;

    }
    public ArrayList NonRepairedItemReportDisplay(ViewClass view)throws ClassNotFoundException, SQLException {
    conn = (Connection)DBconnectionSingleton.conn();
    String query=”Select name,amount from returnitem type=’NonReparing-item'”;
    String st = view.getSt();
    ArrayList al = null;
    ArrayList listView = new ArrayList();

    Statement sta = (Statement) conn.createStatement();
    ResultSet rs = sta.executeQuery(query);

    while (rs.next()) {
    al = new ArrayList();

    al.add(rs.getString(1));
    al.add(rs.getString(2));

    listView.add(al);
    }

    conn.close();
    System.out.println(“Disconnected from database”);

    return listView;

    }
    }

    //This my pie chat java class . my proble i haven’t properly idea how to do this. i think it is my error

    <%@ page language=”java” contentType=”text/html; charset=ISO-8859-1″
    pageEncoding=”ISO-8859-1″%>
    <%@ page import=”java.util.*” %>
    <%@ page import=”com.google.gson.Gson”%>
    <%@ page import=”com.google.gson.JsonObject”%>

    <%
    int Total = 0;
    int count = 0;
    String xVal, yVal;
    if (request.getAttribute(“result”) != null) {
    ArrayList al = (ArrayList) request.getAttribute(“result”);
    System.out.println(al);
    Iterator itr = al.iterator();
    while (itr.hasNext()) {
    count++;
    ArrayList list = (ArrayList)itr.next();
    list.get(0);
    list.get(1);
    list.get(2);
    list.get(3);
    list.get(4);
    list.get(5);
    }

    }
    %>
    <!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
    <html>
    <head>
    <meta http-equiv=”Content-Type” content=”text/html; charset=ISO-8859-1″>
    <title>Damage and Stock Report</title>
    </head>

    <script type=”text/javascript”>
    window.onload = function() {

    var dps = [[], []];
    var chart = new CanvasJS.Chart(“chartContainer”, {
    exportEnabled: true,
    animationEnabled: true,
    theme: “dark1”,
    title: {
    text: “Analysis Stock Information”
    },
    subtitles: [{
    text: “Click Legend to Hide or Unhide Data Series”
    }],
    axisY1: {
    title: “Stock”,
    titleFontColor: “#4F81BC”,
    lineColor: “#4F81BC”,
    labelFontColor: “#4F81BC”,
    tickColor: “#4F81BC”,
    },
    axisY2: {
    title: “Damage”,
    titleFontColor: “#C0504E”,
    lineColor: “#C0504E”,
    labelFontColor: “#C0504E”,
    tickColor: “#C0504E”
    },
    axisY3: {
    title: “NonAvailable”,
    titleFontColor: “#FF00FF”,
    lineColor: “#FF00FF”,
    labelFontColor: “#FF00FF”,
    tickColor: “#FF00FF”
    },
    axisY4: {
    title: “Repaired”,
    titleFontColor: “#7CFC00”,
    lineColor: “#7CFC00”,
    labelFontColor: “#7CFC00”,
    tickColor: “#7CFC00”
    },
    axisY5: {
    title: “Return”,
    titleFontColor: “#FFFF00”,
    lineColor: “#FFFF00”,
    labelFontColor: “#FFFF00”,
    tickColor: “#FFFF00”
    },
    axisY6: {
    title: “NonRepaired”,
    titleFontColor: “#F5FFFA”,
    lineColor: “#F5FFFA”,
    labelFontColor: “#F5FFFA”,
    tickColor: “#F5FFFA”
    },
    toolTip: {
    shared: true
    },
    legend: {
    cursor: “pointer”,
    itemclick: toggleDataSeries
    },
    data: [{
    type: “column”,
    name: “Amount”,
    showInLegend: true,
    yValueFormatString: “####”,
    dataPoints: dps[0]
    },
    {
    type: “column”,
    name: “Name”,
    axisYType: “secondary”,
    showInLegend: true,
    dataPoints: dps[1]
    },
    {
    type: “column”,
    name: “Name”,
    axisYType: “secondary”,
    showInLegend: true,
    dataPoints: dps[2]
    },
    {
    type: “column”,
    name: “Name”,
    axisYType: “secondary”,
    showInLegend: true,
    dataPoints: dps[3]
    },
    {
    type: “column”,
    name: “Name”,
    axisYType: “secondary”,
    showInLegend: true,
    dataPoints: dps[4]
    },
    {
    type: “column”,
    name: “Name”,
    axisYType: “secondary”,
    showInLegend: true,
    dataPoints: dps[5]
    }]
    });

    var yValue;
    var label;

    <c:forEach items=”${list}” var=”dataPoints” varStatus=”loop”>
    <c:forEach items=”${dataPoints}” var=”dataPoint”>
    yValue = parseFloat(“${dataPoint.y}”);
    label = “${list.get(1);}”;
    dps[parseInt(“${loop.index}”)].push({
    label : label,
    y : yValue,
    });
    </c:forEach>
    </c:forEach>

    chart.render();

    function toggleDataSeries(e) {
    if (typeof (e.dataSeries.visible) === “undefined” || e.dataSeries.visible) {
    e.dataSeries.visible = false;
    } else {
    e.dataSeries.visible = true;
    }
    e.chart.render();
    }

    }

    </script>
    <body>
    <div id=”chartContainer” style=”height: 370px; width: 100%;”></div>
    <script src=”https://canvasjs.com/assets/script/canvasjs.min.js”></script>
    </body>
    </html>

    my db connection class
    public class DBconnectionSingleton {
    public static Connection conn() {

    Connection conn = null;

    try {
    Class.forName(“com.mysql.jdbc.Driver”);
    conn = DriverManager.getConnection(“jdbc:mysql://localhost:3306/hdwear”, “root”, “”);
    System.out.println(“Connected to the database..”);

    } catch (SQLException | ClassNotFoundException e) {
    System.out.println(e);
    }
    return conn;
    }
    }

    #22633

    #22634
    #22650

    Priyanka M S
    Member

    @dilrukshirajapakshe,

    Can you please share the link of the sample project reproducing the issue you are facing over one-drive or google-drive so that we can look into your code, understand the scenario better and help you out?

    __
    Priyanka M S
    Team CanvasJS

    #22653

    https://drive.google.com/drive/u/0/folders/1SUVPN2TeOGaTRTYQ1i2HZHrIh2bu0EYD

    I change my cord after chart show but data not coming to the chart . but data stord in arrylist. i cant understand what’s the problem

    #22655

    Vishwas R
    Keymaster

    @dilrukshirajapakshe,

    I observe that the X-Value being passed in the view is a string, whereas X-Value can either be number or date-time. However you can use label to show names, which accepts string. Can you try changing map.put("x", xVal); to map.put("label", xVal); in Report.jsp (line no: 29) and check if it works?

    If this doesn’t solve your issue, I request you to export your project as war/archive along with database so that we can run the project locally, understand your issue better and help you out.


    Vishwas R
    Team CanvasJS

    #22657

    i fixed this error. thanks for your help and your page is very helpful for me . i am beginner of java sprint mvc frame work this my first java project. i realy thank’s for you team

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.