Computer Graphics - DDA Algorithm (Digital Differential Analyzer)

Assalamualaikum warahmatullah.
Konbanwa, mina!
Late post. Kali ini adalah mata kuliah pada saat saya semester 5. Perlu kita sepakati bersama, bahwa atribut paling primitif dalam pembentukan grafik adalah titik dan garis. Jika kita sudah mengerti bagaimana membuat kedua atribut tersebut, kita mampu menguasai dunia (Akatsuki :D ). Baik, untuk membuat atribut tersebut terkenal 2 teorema yang paling mudah yaitu Algoritma DDA dan Bresenham. kali ini kita akan mempelajari Algoritma DDA dan penerapannya pada pemrograman.

Berikut ini adalah Algoritma DDA

1. tentukan 2 buah titik
2. tentukan yang menjadi titik awal(X₀,Y₀) dan titik akhir(X₁,Y₁)
3. Hitung Dx= X₁-X₀   dan Dy = Y₁ – Y₀
4. Bandingkan Abs(Dx) dan Abs(Dy). Jika Abs(Dx)>Abs(Dy) maka Steps = Abs(Dx), jika tidak maka Steps = Abs(Dy).
5. Hitung penambahan koordinat pixel atau interval, yaitu intervalX= Dx/Steps, dan intervalY= Dy/Steps.
6. Koordinat selanjutnya yaitu X+intervalX dan Y+intervalY.
7. posisi pixel ditentukan dengan pembulatan nilai koordinat pada langkah ke 6
8. Ulangi langkah ke 6 dan 7 hingga X=X₁ dan Y=Y₁  

PRAKTIKUM
Membuat Aplikasi Sederhana Pembuat Garis dengan Algoritma DDA.
Bahasa Pemrograman yang digunakan adalah Java dengan IDE Eclipse.
1. Buat Class DDA.java dengan source code sebagai berikut:

package graphics;
import java.awt.*;
public class DDA {
public int dx;
public int dy;
public double x_tambah;
public double y_tambah;
public int step;
public double x,y;
public void drawDDA(Graphics g, int x_awal, int y_awal, int x_akhir, int y_akhir){
this.x=x_awal;
this.y=y_awal;
this.dx=Math.abs(x_awal-x_akhir);
this.dy=Math.abs(y_awal-y_akhir);
this.step=Math.max(this.dx, this.dy);
this.x_tambah=(double)this.dx/this.step;
this.y_tambah=(double)this.dy/this.step;
while((int)this.x!=x_akhir && (int)this.y!=y_akhir){
g.fillRect((int)this.x,(int)this.y,2,2);
if(x_awal==x_akhir){
this.y=this.y+y_tambah;
this.x=0;
}
if(y_awal==y_akhir){
this.x=this.x+x_tambah;
this.y=0;
}
if(x_akhir>x_awal){
this.x=this.x+x_tambah;
}else{
this.x=this.x-x_tambah;
}
if(y_akhir>y_awal){
this.y=this.y+y_tambah;
}else{
this.y=this.y-y_tambah;
}
/*System.out.println(this.x);
System.out.println(this.y);*/
}
}
}

2. Buat Class yang menyediakan GUI dan dapat di run oleh Java dengan nama Main.java. source codenya sebagai berikut:

package graphics;
/*
 * Author : Novida Wayan Sari
 * Program Name : Main
 * Description : This program integrate component JPanel 
 *  that used for drawing graphics like
 *  Line DDA and also
 *  coloring the component
 */
import java.awt.Color;
import java.awt.Graphics;
import java.awt.Point;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.event.MouseAdapter;
import java.awt.event.MouseEvent;
import java.util.ArrayList;
import javax.swing.ImageIcon;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;

public class Main implements ActionListener{

//Attributes
private static ArrayList<int[]> coord = new ArrayList<int[]>();
private static ArrayList<int[]> coord2 = new ArrayList<int[]>();

//Main Program
public static void main(String [] Args) throws Exception{
JFrame frame=new JFrame("My Graphics Board");
frame.setSize(700, 500);
frame.setVisible(true);
frame.getContentPane().setBackground(Color.BLACK);

//Buttons Declaration
final JButton btn_color1=new JButton();
final JButton btn_color2=new JButton();
final JButton btn_color3=new JButton();
final JButton btn_color4=new JButton();

//Panel Component as Board for drawing
JPanel panel=new JPanel(){

/**
* 
*/
private static final long serialVersionUID = 1L;
Point point_start=null; //for collect point value when mouse pressed
Point point_end=null; //for collect point value when mouse Released
Point point_end2=null; //for collect point value when mouse Dragged
//it need for animation when mouse Dragged
int status_graph=1;
int status_color=1;

//Mouse Listener for Button
{
btn_color1.addMouseListener(new MouseAdapter() {
public void mouseClicked(MouseEvent evt) {
status_color=1;
}
});
btn_color2.addMouseListener(new java.awt.event.MouseAdapter() {
public void mouseClicked(MouseEvent evt) {
status_color=2;
}
});
btn_color3.addMouseListener(new java.awt.event.MouseAdapter() {
public void mouseClicked(MouseEvent evt) {
status_color=3;
}
});
btn_color4.addMouseListener(new java.awt.event.MouseAdapter() {
public void mouseClicked(MouseEvent evt) {
status_color=4;
}
});
}
DDA dda=new DDA();
{
addMouseListener(new MouseAdapter(){
public void mousePressed(MouseEvent e){
point_start=e.getPoint();
}
public void mouseReleased(MouseEvent e){
point_end=e.getPoint();
                        int[] points = {(int)point_start.getX(),(int)point_start.getY(),(int)point_end.getX(),(int)point_end.getY(),status_graph,status_color};
                        coord.add(points);
                        repaint();
}
});
addMouseMotionListener(new MouseAdapter(){
public void mouseDragged(MouseEvent e){
point_end2=e.getPoint();
int[] points2 = {(int)point_start.getX(),(int)point_start.getY(),(int)point_end2.getX(),(int)point_end2.getY(),status_graph,status_color};
coord2.add(points2);
repaint();
}
});
}
public void paintComponent(Graphics g){
                for (int[] points2 : coord2) {
                if((int)points2[5]==1){
g.setColor(Color.BLUE);
}else if((int)points2[5]==2){
g.setColor(Color.GREEN);
}else if((int)points2[5]==3){
g.setColor(Color.RED);
}else{
g.setColor(Color.YELLOW);
}
                super.paintComponent(g);
                dda.drawDDA(g, (int)points2[0], (int)points2[1], (int)points2[2], (int)points2[3]);
                } 
                g.drawString("   ------", 0, 15);
                g.drawString("   ------", 0, 30);
                g.drawString("   ------", 0, 45);
                g.drawString("   ------", 0, 60);
                g.drawString("Novida's Paint Board", 480, 15);
                g.drawString("Choose Color", 500, 65);
}
public void paint(Graphics i){
super.paint(i);
for (int[] points : coord) {
if((int)points[5]==1){
i.setColor(Color.BLUE);
}else if((int)points[5]==2){
i.setColor(Color.GREEN);
}else if((int)points[5]==3){
i.setColor(Color.RED);
}else{
i.setColor(Color.YELLOW);
}
dda.drawDDA(i, (int)points[0], (int)points[1], (int)points[2], (int)points[3]);
} 
}

}; //End of Panel
panel.add(btn_color1);
panel.add(btn_color2);
panel.add(btn_color3);
panel.add(btn_color4);
ImageIcon icon5=new ImageIcon("images/color_blue.png");
ImageIcon icon6=new ImageIcon("images/color_orange.png");
ImageIcon icon7=new ImageIcon("images/color_red.png");
ImageIcon icon8=new ImageIcon("images/color_yellow.png"); 
btn_color1.setIcon(icon5);
btn_color1.setContentAreaFilled( false ); 
btn_color2.setIcon(icon6);
btn_color2.setContentAreaFilled( false ); 
btn_color3.setIcon(icon7);
btn_color3.setContentAreaFilled( false ); 
btn_color4.setIcon(icon8);
btn_color4.setContentAreaFilled( false ); 
panel.setBackground(Color.BLACK);
panel.setForeground(Color.BLACK);
frame.add(panel);
frame.setVisible(true);
}
@Override
public void actionPerformed(ActionEvent e) {
// TODO Auto-generated method stub

}
}

Hasil dari program tersebut adalah sebagai berikut:

Gambar 1. Papan Gambar

Gambar 2. Papan setelah digambar dengan Garis

Selamat Bereksperimen!