converting ArraList to JSON (in Java) and accessing it with Javascript

Question

the purpose of this project is to select an area of the image, send that area to the db, retrieve that selected area and paint the area of the image which was selected. I have a database filled with rows of coordinates. So I made an object - Area, to represent that table with rows of coordinates. ViewArea has four values: int x1, int x2, int y1 and int y2.

public class ViewArea extends Area
{
    public ViewArea(int x1, int y1, int x2, int y2)
    {
        super(x1, x2, y1, y2);
    }

}

Since there might be a growing number of rows, meaning as well a growing number of Area objects, I made a class AreaInputView with a List. In the init() of the class I populate the list and convert it to JSONArray (as seen in examples while googling).

@ManagedBean
@ApplicationScoped
public class AreaInputView implements Serializable
{

    /**
     * 
     */
    private static final long serialVersionUID = -3957666682646196671L;

    MyDatabase db = new MyDatabase();

    private List<ViewArea> areaList;
    private JSONArray jsonAreaList;

    public List<ViewArea> getAreaList()
    {
        return areaList;
    }


    @PostConstruct
    public void init()
    {
        this.areaList = new ArrayList<ViewArea>();
        populateList();
        this.jsonAreaList = new JSONArray(areaList);
    }



    public JSONArray getJsonAreaList()
    {
        return jsonAreaList;
    }

    public void populateList()
    {
        db.openDatabase();

        try
        {
            db.pstmt = db.con.prepareStatement("SELECT * FROM area");
            ResultSet rs = db.pstmt.executeQuery();

            while (rs.next())
            {
                areaList.add(new ViewArea(rs.getInt("X1"), rs.getInt("X2"), rs.getInt("Y1"), rs
                        .getInt("Y2")));
            }
        }
        catch (SQLException e)
        {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }

    }



}

So far so good.. now we go to the js. In the JS I made a function which takes in four values which then i use to drawImage on the canvas which is the image in use.

function viewInput(dx1,dy1,dx2,dy2) {
    var canvas = document.getElementById('home:tempImg');
    var context = canvas.getContext('2d');
    var imageObj = new Image();

    imageObj.onload = function() {
      context.drawImage(imageObj, dx1, dy1,dx2-dx1,dy2-dy1);
    };
    imageObj.src = 'images/selected.png';
}

My problem is that I can not access the JSON object from javascript since javascript is client side while the JSON is in java and java is server side. The point is to iterate through the JSON object and for each object apply the js function. I have an option to write the data on a .js file so I could access it there, but there must be a way around this. Any suggestions?

warcops · Accepted Answer · 2014-11-25 16:40:19Z

1

Request the JSON from the js to the server. At the server side, convert the JSON object into plain string and return with content type as application/json.

You should have the proper JSON available to you

answered Nov 25, 2014 at 16:40

warcops

737 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

FancyPants Over a year ago

Hey, thanks for responding. Meaning one by one or populate the list and then convert it?

warcops Over a year ago

yup, that should do it

FancyPants Over a year ago

You didn't specify which option to use.

FancyPants Over a year ago

Yes I am, more specific I am using primefaces 5.1 with jsf2.2

warcops Over a year ago

if u used the bean method to assign the JSONArray to a js var, it should work fine

|

kamoor · Accepted Answer · 2014-11-25 16:36:19Z

0

You may need to create a REST service end point and expose Array content as JSON. then you should be able to retrieve JSON from browser and consume it. Simple way of creating such end point is given in spring documentation https://spring.io/guides/gs/rest-service

answered Nov 25, 2014 at 16:36

kamoor

2,9493 gold badges21 silver badges34 bronze badges

2 Comments

FancyPants Over a year ago

Thanks for responding ! A promising solution, for sure. But this seems unnecessary as my newbie head has an intuition that I can get around this without adding additional dependencies and all of that. Although I did add it to my solutions, just trying to find the most optimal one.

kamoor Over a year ago

I am assuming you are writing web application. At the least you need to expose a servlet controller and write JSON string (jsonAreaList.toString() will give you string) to the http response. Otherwise what ever you are doing in server will simply not be available in browser.

Collectives™ on Stack Overflow

converting ArraList to JSON (in Java) and accessing it with Javascript

2 Answers 2

8 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

8 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related