hey everyone, i am creating a project from already created code below. this is just one class of it.
this class projects 4 or less points on the image. the source for those points is received from wii (gaming consoles) remote that tracks infra-red light so it displays infra-red light coordinates on the screen and represents it as dots.

what i need is : in the paint component when it is drawing the points i dont clearly understand how all the points are drawn and what i would need is different variable for each point to store the coordinates so i could be able to work with each point seperatly.

i hope this explanation is clear enough, if not let me know,

thank you

public class IRPanel extends javax.swing.JPanel implements WiimoteListener {

	private static int MAX_NB_POINTS = 4;
	private Color color = Color.WHITE;
	private Color backgroundColor = Color.BLUE;
	private Color borderColor = Color.RED;
	private Shape shape;
	private Image mImage;// image for double buffering
	private int[] xCoordinates;
	private int[] yCoordinates;
	private int nbPoints = -1;

	public IRPanel() {

		shape = new Ellipse2D.Double(0, 0, 10, 10);

	public IRPanel(Color bgColor, Color ptColor, Color bdColor, Shape sh) {
		backgroundColor = bgColor;
		color = ptColor;
		borderColor = bdColor;
		shape = sh;

	private void initArrays() {
		xCoordinates = new int[MAX_NB_POINTS];
		yCoordinates = new int[MAX_NB_POINTS];
		for (int i = 0; i < MAX_NB_POINTS; i++) {
			xCoordinates[i] = -1;
			yCoordinates[i] = -1;

	public void paintComponent(Graphics g) {
		Dimension d = getSize();
		Graphics offG = mImage.getGraphics();
		offG.fillRect(0, 0, d.width, d.height);
		Graphics2D g2 = (Graphics2D) mImage.getGraphics();
//		g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING,
//				RenderingHints.VALUE_ANTIALIAS_ON);

                //draw line

		// draw points
		int i = 0;
		while (i < nbPoints) {
			double x = xCoordinates[i];
			double y = yCoordinates[i];

			long xx = getWidth() - Math.round((double) getWidth() * x / 1024.0);
			long yy = getHeight()- Math.round((double) getHeight() * y / 768.0);
			g2.translate(xx, yy);
int xa = xCoordinates[i];
int xb = yCoordinates[i];

                        g2.fillOval(0, 0, 30, 30);

		     //   g2.fill(shape);
			g2.setTransform(new AffineTransform());


		g.drawImage(mImage, 0, 0, null);

	private void checkOffScreenImage() {
		Dimension d = getSize();
		if (mImage == null || mImage.getWidth(null) != d.width
				|| mImage.getHeight(null) != d.height) {
			mImage = createImage(d.width, d.height);

	public void onIrEvent(IREvent arg0) {
		// transfer points
		wiiusej.values.IRSource[] points = arg0.getIRPoints();
		nbPoints = points.length;
		for (int i = 0; i < points.length; i++) {
			xCoordinates[i] = (int) points[i].getRx();
			yCoordinates[i] = (int) points[i].getRy();
		for (int i = points.length; i < MAX_NB_POINTS; i++) {
			xCoordinates[i] = -1;
			yCoordinates[i] = -1;

		// redraw panel

	public void onDisconnectionEvent(DisconnectionEvent arg0) {
		// clear previous points
		for (int i = 0; i < MAX_NB_POINTS; i++) {
			xCoordinates[i] = -1;
			yCoordinates[i] = -1;
		// redraw panel

	public Color getBackgroundColor() {
		return backgroundColor;

	public Color getBorderColor() {
		return borderColor;

	public Color getColor() {
		return color;

	public Shape getShape() {
		return shape;

	public void setBackgroundColor(Color backgroundColor) {
		this.backgroundColor = backgroundColor;

	public void setBorderColor(Color borderColor) {
		this.borderColor = borderColor;

	public void setColor(Color color) {
		this.color = color;

	public void setShape(Shape shape) {
		this.shape = shape;

	public void clearView() {

	private void initComponents() {

		GroupLayout layout = new GroupLayout(this);
		layout.setHorizontalGroup(layout.createParallelGroup(GroupLayout.Alignment.LEADING).addGap(0, 700,Short.MAX_VALUE));
		layout.setVerticalGroup(layout.createParallelGroup(GroupLayout.Alignment.LEADING).addGap(0, 300,Short.MAX_VALUE));

It looks like the coords are loaded into the x/ycoordinates arrays - so each element of the array-pair represents a different point. In which case you already have access to all the points, you don't need any new variables.
Eg - to connect the first two points by a line you need to draw from
xcoordinate[0], ycoordinate[0] to xcoordinate[1], ycoordinate[1]

ps: Line 99 looks like you get the complete set of points neatly packaged as Point objects in an array of the right size, so I don't see why it goes to all the trouble of extracting them into two new arrays.

Edited 6 Years Ago by JamesCherrill: n/a

thanks for the reply, i actually tried this but for some reason the line is correct length like the distance from each point but it moves to the opposite direction from the points.????

thank you

OKI, so you're heading in the right direction. You just need to debug the way you are using the coords to draw the line.I notice the coordinate system seems to go right-to-left, which is odd, and my have a connection with your direction problem?
Although it's more satisfying to solve problems by force of logic, sometimes trial-and-error is quicker. I'd be tempted to try swapping a few coords, and maybe adding a judicious minus sign or two and see what works.

ok i got something.., well i got rid of the points but im only using the line now, which moves correctly, by flowing ifrared lights from left to right like a mirror reflection(this is what i want). but when i move infrared lights up, the line on the screen moves down or if i rotate the two lights the turn is performed in opposite direction.
im a little confused by any chance can you see why it is doing that???
thanks once again

That sounds like the y coordinate is going + when it should be - and v.v.
line 65 says

long yy = getHeight()- Math.round((double) getHeight() * y / 768.0);

you MAY find that this version maps the coords the other way up...

long yy =  Math.round((double) getHeight() * y / 768.0);

if not, try a bit more experimenting with the sign of the y coords

Try inverting your Y coordinate by subtracting it from your height.

Your original code showed transformations being applied to position the ovals, so it would seem your IR device is using a different coordinate system than your graphics context.

Use plenty of System.out.println() statements to verify your coordinates and your math.

to JamesCherrill thanks for the advice i tried that still seems to move to the opposite direction ..

to Ezzaral thanks for your reply i am actuly not bery clear about inverting my Y coords by subtracting from hight could you be a bit more specific thank you

Remember the origin of your graphics context is the upper left corner and y increases downward. If your input is using the lower left corner as an origin and increases upward, you need to invert your Y coordinate by subtracting it from the height of your area when you draw the point.

Ezzaral: Hi there.
The original code already has this inversion in its scaling of the coordinate system:

long yy = getHeight()- Math.round((double) getHeight() * y / 768.0);

I suggested removing the subtraction from the height

long yy =  Math.round((double) getHeight() * y / 768.0);

so that's the same thing that you suggested, except that we're starting from the opposite situation.
If that failed to invert the y behaviour then maybe the coordinate scaling isn't getting applied at all?

that does work thank you, but well the Eclipse2d shape is moving to the exact direction that i which it to move it is exact mirror effect

but my line that i drew is still moving oposite way i have added

g2.drawLine(xCoordinates[0], yCoordinates[0], xCoordinates[1], yCoordinates[1]);

between the line 83-84.
i have actually placed it in a few different places but still the line moves to opposite directions just the eclipse 2d shape is doing what i want.

thanks again for all the help im getting

well this doesnt work at all. what happens is when one infra-red light is detected the line follows from that point in to some other distance outside the screen but if there are more than one of infrared lights the line dose not show at all.

this is totally bizarre i just tested the coord that i get xCoordinates and yCoordinates and when i specify to draw a line between xcoord[0] ycoord[0] to xcoord[1] y coords[1] it just dosnt work but with System.out.println it shows that the coordinates are produced.
it does draw the line when only 1 points is visible and it draws the line to these coord from the point position to x=-1 and y=-1.
it does not draw a line when both points are visible..........

This article has been dead for over six months. Start a new discussion instead.