Applet - Graphing Quadratic Function Help

[crawf]

Hi!

Im making an applet to graph a quadratic function...now im not going to be rude and say "tell me how to do it!" but i was just wondering if i could get some assistance on making it...

Now of course, i've had a go at it, and i've made an applet to display the z intercepts, y intercept, and vertex (turning point). This is determined by the user inputs of the three coefficients a, b, and c.

First question, is this all the information i will need?

Secondly, i am struggling to figure out how to put this information into a graph and make it a parabola...

Thank you very much for your help!

Ps. my applet is below if you wish to have a look, i've made a crude graph if that helps as well...


import java.applet.*;
import java.awt.*;
import java.awt.event.*;

public class Graph2 extends Applet implements ActionListener {

TextField aInput, bInput, cInput;
double a, b, c;
boolean notFirst;
Button calcButton;
int size = 400;

public void init() {
setLayout(null);
resize(600, 500);
Label labelA = new Label("Value a:");
labelA.setBounds(412, 40, 50, 20);
Label labelB = new Label("Value b:");
labelB.setBounds(412, 70, 50, 20);
Label labelC = new Label("Value c:");
labelC.setBounds(412, 100, 50, 20);
aInput = new TextField("2", 5);
aInput.setBounds(470, 40, 80, 20);
bInput = new TextField("5", 5);
bInput.setBounds(470, 70, 80, 20);
cInput = new TextField("-12", 5);
cInput.setBounds(470, 100, 80, 20);
calcButton = new Button("Solve");
calcButton.setBounds(460, 130, 45, 20);
add(labelA);
add(aInput);
add(labelB);
add(bInput);
add(labelC);
add(cInput);
add(calcButton);
aInput.addActionListener(this);
bInput.addActionListener(this);
cInput.addActionListener(this);
calcButton.addActionListener(this);
notFirst = false;
}

public void makeGraph(Graphics g) {
g.setColor(Color.lightGray);
// Draw grid
for (int y = 0; y <= size; y = y + 10) {
g.drawLine(1, y, size, y);
}
for (int x = 0; x <= size; x = x + 10) {
g.drawLine(x, 1, x, size);
}
g.setColor(Color.red);
// Draw y axis
g.drawLine(size / 2, 0, size / 2, size);
for (int i = 0; i <= size; i = i + 20) {
g.drawLine(size / 2 - 5, i, size / 2 + 5, i);
}
g.setColor(Color.blue);
// Draw x axis
g.drawLine(0, size / 2, size, size / 2);
for (int j = 0; j <= size; j = j + 20) {
g.drawLine(j, size / 2 - 5, j, size / 2 + 5);
}
g.setColor(Color.black);
// Draw positive x axis numbers
for (int n = 0; n <= 5; n++) {
g.drawString("" + n * 2, (size / 2 - 4) + n * 40, size / 2 + 17);
}
// Draw negative x axis numbers
for (int n = 1; n <= 5; n++) {
g.drawString("-" + n * 2, (size / 2 - 6) - n * 40, size / 2 + 17);
}
// Draw positive y axis numbers
for (int n = 1; n <= 5; n++) {
g.drawString("" + n * 2, size / 2 - 21, (size / 2 + 5) - n * 40);
}
// Draw negative y axis numbers
for (int n = 1; n <= 5; n++) {
g.drawString("-" + n * 2, size / 2 - 23, (size / 2 + 6) + n * 40);
}
}

public void paint(Graphics g) {
int yValue = 180;
makeGraph(g);
g.drawString("y = ax\u00B2 + bx + c", 420, 20);
if (notFirst) {
double zero = ((( -b) + (Math.sqrt((b * b) - (4 * (a * c))))) / (2 * a));
double zero2 = ((( -b) - (Math.sqrt((b * b) - (4 * (a * c))))) / (2 * a));
g.drawString("a = " + a, 420, yValue);
g.drawString("b = " + b, 420, yValue + 20);
g.drawString("c = " + c, 420, yValue + 40);
if (a == 0) {
g.drawString("a Cannot Be 0", 420, yValue + 80);
} else {
if (((b * b) - (4 * a * c)) < 0) {
g.drawString("No Real Solution", 420, yValue + 80);
} else {
g.drawString("Zero = (" + zero + ", 0)", 420, yValue + 80);
g.drawString("Zero = (" + zero2 + ", 0)", 420, yValue + 100);
g.drawString("Y Intercept = (0, " + c + ")", 420, yValue + 120);
double turnX = -b / (2 * a);
double turnY = c - (Math.pow(b, 2)) / (4 * a);
g.drawString("Vertex = (" + turnX + ", " + turnY + ")", 420, yValue + 140);
double d = (Math.pow(b, 2)) - 4 * a * c;
g.drawString("Discriminant = " + d, 420, yValue + 160);
if (a < 0) {
g.drawString("Parabola = Down", 420, yValue + 180);
} else {
g.drawString("Parabola Direction = Up", 420, yValue + 180);
}
}
}
}
}

public void actionPerformed(ActionEvent e) {
notFirst = true;
if (e.getSource() == calcButton) {
a = Double.parseDouble(aInput.getText());
b = Double.parseDouble(bInput.getText());
c = Double.parseDouble(cInput.getText());
if (aInput.getText().equals("")) {
a = 0;
}
repaint();
}
}
}




-Crawf

[krzysieq]

You might also want to get some sort of scaling variables from the user. Just because You know the coefficients of the equation:

y = a * x ^ 2 + b * x + c

doesn't mean You can easily draw the parabola. Of course, You might hard - code that into Your applet, but it's not nice. A good solution is to ask the user for the range of x for which they want the function drawn. If Your user asks for a [0,10] chart, Your axis are gonna look different than if they ask for a [-5,5] chart. Pretty obvious, isn't it?

Now that You got the range, You can determine the range of y, which is not so difficult for anyone, who knows anything about quadratic functions. Only then I would start thinking about drawing anything.

BTW. I don't know much about writing applets, but I've done something like this in c++ a while ago.

[crawf]

yeah you are right, i should put in some sort of scaling system, that would make things a hell of a lot easier!

Good thinking! i forgot about that!

Hmm....im not sure how to scale the graph really...should i make a whole other one? i'm just not sure how i can change the values, ill play around with it though!

-Crawf

[krzysieq]

Ok. When You've done that, You can calculate, how much of x does a single pixel mean. If, for instance, your chart is supposed to depict the set [-10,10] on a 200 pixel square, then a pixel is a unit of 0,1 on the x axis. You can do the same with the other axis. Suppose You name these the xunit and yunit, both of type double.

Another thing, extremely important, is to determine the position of the middle of coordinate set, that is the (0,0) point. If You have all of these, then you can calculate the "pixel" value of your function on a "pixel" argument. It's important to have the (0,0) on the picture, but a friend of mine did a drawing program that could do without it - it could draw for x in [2,10] for instance. I'd recommend trying to have the middle on Your pic, however.

Drawing now is a matter of having a loop that goes from pixel x=0 to pixel x=MAX_X_PIXELS (or whatever it is You named it), and calculates:

y = (f((x - x0) * xunit) * yunit) - y0

I assumed here that the topleft corner is the pixel with coordinates (0,0), (x0,y0) are the coordinates of the (0,0) point. Hope this helps a little :)

There might be issues concerning the bounds of the set and the screen - I haven't done any in-head-debugging of what I wrote. Anyways - this method works nice for most continuous functions, not only quadratic. If the difference of vaue between neighboring pixels is large though, You might consider linking them with vertical lines, so that the chart does look like a line, and not like a set of disjoint points.

[crawf]

okay! that sounds okay to me! ill have a go!

Thanks for your help! :)

-Crawf

[crawf]

lol, problems already...i cant seem to get the scale to work that great...i wont try and explain it, because ill confuse you and myself, but the values are printed off the screen further...

here is what it have so far...


import java.applet.*;
import java.awt.*;
import java.awt.event.*;

public class Graph3 extends Applet implements ActionListener {

TextField aInput, bInput, cInput, rangeXField, rangeYField;
double a, b, c;
boolean notFirst;
Button calcButton;
int size = 400;
int rangeX, rangeY;
double yunit,xunit;

public void init() {
setLayout(null);
resize(600, 500);
Label labelA = new Label("Value a:");
labelA.setBounds(412, 40, 50, 20);
Label labelB = new Label("Value b:");
labelB.setBounds(412, 70, 50, 20);
Label labelC = new Label("Value c:");
labelC.setBounds(412, 100, 50, 20);
aInput = new TextField("2", 5);
aInput.setBounds(470, 40, 80, 20);
bInput = new TextField("5", 5);
bInput.setBounds(470, 70, 80, 20);
cInput = new TextField("-12", 5);
cInput.setBounds(470, 100, 80, 20);
calcButton = new Button("Solve");
calcButton.setBounds(460, 130, 45, 20);
Label labelX = new Label("X Range:");
labelX.setBounds(412, 170, 50, 20);
rangeXField = new TextField("6",5);
rangeXField.setBounds(470, 170, 45, 20);
Label labelY = new Label("Y Range:");
labelY.setBounds(412, 200, 50, 20);
rangeYField = new TextField("6",5);
rangeYField.setBounds(470, 200, 45, 20);
add(labelA);
add(aInput);
add(labelB);
add(bInput);
add(labelC);
add(cInput);
add(calcButton);
add(labelX);
add(rangeXField);
add(labelY);
add(rangeYField);
aInput.addActionListener(this);
bInput.addActionListener(this);
cInput.addActionListener(this);
calcButton.addActionListener(this);
rangeXField.addActionListener(this);
rangeYField.addActionListener(this);
notFirst = false;
}

public void makeGraph(Graphics g) {
g.setColor(Color.lightGray);
// Draw grid
for (int y = 0; y <= size; y = y + 10) {
g.drawLine(1, y, size, y);
}
for (int x = 0; x <= size; x = x + 10) {
g.drawLine(x, 1, x, size);
}
g.setColor(Color.red);
// Draw y axis
g.drawLine(size / 2, 0, size / 2, size);
for (int i = 0; i <= size; i = i + 20) {
g.drawLine(size / 2 - 5, i, size / 2 + 5, i);
}
g.setColor(Color.blue);
// Draw x axis
g.drawLine(0, size / 2, size, size / 2);
for (int j = 0; j <= size; j = j + 20) {
g.drawLine(j, size / 2 - 5, j, size / 2 + 5);
}
g.setColor(Color.black);
// Draw positive x axis numbers
for (int n = 0; n <= rangeX; n++) {
g.drawString("" + n * 2, (size / 2 - 4) + n * 40, size / 2 + 17);
}
// Draw negative x axis numbers
for (int n = 1; n <= rangeX; n++) {
g.drawString("-" + n * 2, (size / 2 - 6) - n * 40, size / 2 + 17);
}
// Draw positive y axis numbers
for (int n = 1; n <= rangeY; n++) {
g.drawString("" + n * 2, size / 2 - 21, (size / 2 + 5) - n * 40);
}
// Draw negative y axis numbers
for (int n = 1; n <= rangeY; n++) {
g.drawString("-" + n * 2, size / 2 - 23, (size / 2 + 6) + n * 40);
}
}

public void paint(Graphics g) {
int yValue = 250;
makeGraph(g);
g.drawString("y = ax\u00B2 + bx + c", 420, 20);
if (notFirst) {
double zero = ((( -b) + (Math.sqrt((b * b) - (4 * (a * c))))) / (2 * a));
double zero2 = ((( -b) - (Math.sqrt((b * b) - (4 * (a * c))))) / (2 * a));
g.drawString("a = " + a, 420, yValue);
g.drawString("b = " + b, 420, yValue + 20);
g.drawString("c = " + c, 420, yValue + 40);
if (a == 0) {
g.drawString("a Cannot Be 0", 420, yValue + 80);
} else {
if (((b * b) - (4 * a * c)) < 0) {
g.drawString("No Real Solution", 420, yValue + 80);
} else {
g.drawString("Zero = (" + zero + ", 0)", 420, yValue + 80);
g.drawString("Zero = (" + zero2 + ", 0)", 420, yValue + 100);
g.drawString("Y Intercept = (0, " + c + ")", 420, yValue + 120);
double turnX = -b / (2 * a);
double turnY = c - (Math.pow(b, 2)) / (4 * a);
g.drawString("Vertex = (" + turnX + ", " + turnY + ")", 420, yValue + 140);
double d = (Math.pow(b, 2)) - 4 * a * c;
g.drawString("Discriminant = " + d, 420, yValue + 160);
if (a < 0) {
g.drawString("Parabola = Down", 420, yValue + 180);
} else {
g.drawString("Parabola Direction = Up", 420, yValue + 180);
}
}
}
}
}

public void actionPerformed(ActionEvent e) {
notFirst = true;
if (e.getSource() == calcButton) {
a = Double.parseDouble(aInput.getText());
b = Double.parseDouble(bInput.getText());
c = Double.parseDouble(cInput.getText());
rangeX = Integer.parseInt(rangeXField.getText());
rangeY = Integer.parseInt(rangeYField.getText());
if (aInput.getText().equals("")) {
a = 0;
}
repaint();
}
}
}

[krzysieq]

You're trying to draw the axis in the middle, which is no good. Try asking the user to input the following:
a,b,c - the coefficients,
minX, maxX - the domain bounds

I see You have size set to 400, fine. Nice practice is to name constants with capitals, btw. Anyways, suppose You have a method that calculates the value of the quadratic function on a given argument - I'll call it here
public double f(double x)
now:

double xUnit = (maxX - minX) / size;
//calculate the maxY and minY here, check if f has an extreme in the set
//[minX,maxX] not to make an error.
double yUnit = (maxY - minY) / size;

You can now calculate the position of the middle of the coordinate set. Unless the given domain is simmetric, and so is f, this point will not be in the middle of the drawing panel. You can actually calculate it's coordinates without knowing the xUnit and yUnit, but You will need these later anyways.

[crawf]

okay! i think i'm set!

Thanks a lot for your help! i'm extremely greatful!!

-Crawf