TRANSFORMASI (KOMPUTER GRAFIK)

Transformasi merupakan suatu metode untuk mengubah lokasi suatu titik pembentukobjek, sehingga objek tersebut mengalami perubahan. Perubahan objek dengan mengubahkoordinat dan ukuran suatu objek disebut dengan transformasi geometri. Dalam Transformasi dasar yang akan dibahas meliputi translasi, skala, dan rotasi.
1.      Translasi
Translasi berarti memindahkan objek sepanjang garis lurus dari suatu lokasi koordinattertentu kelokasi yang lain tanpa mengubah bentuk objek. Bila suatu objek terbentuk daribeberapa titik maka bila melakukan translasi akan dikenakan terhadap setiap titikpembentuk objek tersebut. Untuk melakukan translasi dapat menggunakan rumus:
x’ = x + tx
y’ = y + ty
Contoh:
Diketahui titik-titik pembentuk objek segitiga yaiu A(10,10), B(30,10), C(10,30) dengan transformasi vector (10,20) lakukan trnslasi terhadap objek segitiga tersebut:
Titik A
x’A = xA + tx                      y’A = yA + ty
= 10 + 10                              = 10 + 20
= 20                                      = 30
A’(20,30)
Titik B
x’B = xB + tx                      y’B = yB + ty
= 30 + 10                              = 10 + 10
= 40                                      = 20
B’(40,20)
Titik C
x’C = xC + tx                      y’C = yC + ty
= 10 + 10                              = 30 + 20
= 20                                      = 50


2.      Skala
Skala digunakan untuk mengubah ukuran suatu objek, bila pada translasi operasi yangdigunakan adalah penjumlahan sedangkan pada skala operasi yang digunakan adalah perkalian. Untuk melakukan skala dapat menggunakan rumus:
x’ = x * tx
y’ = y * ty
sx dan sy merupakan nilai dari scaling factor terhadap sumbu x dan sumbu y.
Contoh :
Diketahui objek segitiga dengan titik A(10,10), B(30,10), C(10,30) di skala denganscaling factor (3,2).
Titik A
x’A = xA * tx                             y’A = yA * ty
= 10 * 3                                       = 10 * 2
= 30                                             = 20
A’(30,20)
Titik B
x’B = xB * tx                              y’B = yB * ty
= 30 * 3                                       = 10 * 2
= 90                                             = 20
B’(90,20)
Titik C
x’C = xC * tx                              y’C = yC * ty
= 10 * 3                                       = 30 * 2
= 30                                             = 60
C’(30,60)


3.      Rotasi
Rotasi merupakan pemutaran terhadap suatu objek, rotasi dapat dinyatakan dalam bentukmatriks. Nilai matriks untuk melakukan rotasi adalah Rotasi suatu titik terhadap pivot point (xp, yp) menggunakan bentuk trigonometri, secaraumum dapat ditulis sebagi berikut:
Contoh:
Diketahui titik-titik pembentuk objek segitiga yaiu A(10,10), B(30,10), C(10,30) dengan sudut rotasi 300 terhadap titik pusat koordinat cartesian (10,10).
Titik A
X’A = Xp + (XA – Xp)Cos 300 – (YA- YP)Sin 300
= 10 + (10 -10) * 0.9 – (10-10) * 0.5
= 10
Y’A = YP + (XA – XP)Sin 300 + (YA – YP)Cos 300
= 10 + (10 – 10) * 0.5 + (10 – 10) * 0.9
= 10
A’(10,10)

Titik B
X’B = Xp + (XA – Xp)Cos 300 – (YA- YP)Sin 300
= 10 + (30 -10) * 0.9 – (10-10) * 0.5
= 28
Y’B = YP + (XA – XP)Sin 300 + (YA – YP)Cos 300
= 10 + (30 – 10) * 0.5 + (10 – 10) * 0.9
= 20
B’(28,20)
Titik C
X’C = Xp + (XA – Xp)Cos 300 – (YA- YP)Sin 300
= 10 + (10 -10) * 0.9 – (30-10) * 0.5
= 0
Y’C = YP + (XA – XP)Sin 300 + (YA – YP)Cos 300
= 10 + (10 – 10) * 0.5 + (30 – 10) * 0.9
= 28
C’(0,28).

Transformasi (Rotasi & Dilatasi)
Transformasi Dua Dimensi, adalah transformasi yang diterapkan pada bidang kartesian dua dimensi, dengan sumbu x dan sumbu y.
Rotasi
Terdiri dari 2 macam rotasi, yakni rotasi berlawanan arah jarum jam (counter-clockwise) dan rotasi searah jarum jam (clockwise).
Persamaan:
1. Berlawanan arah jarum jam (counter-clockwise)
2. Searah jarum jam (clockwise)
Dalam bentuk matrik ditulis sebagai berikut:
1. Berlawanan arah jarum jam (counter-clockwise)
2. Searah jarum jam (clockwise)
Dilatasi
Perbesaran/pengecilan koordinat suatu titik dengan faktor s terhadap pusat bidang (0,0) atau disebut juga dengan istilah scaling.
Persamaan:
Dalam bentuk matrik ditulis sebagai berikut:
Refleksi
• Refleksi adalah transformasi yang membuat mirror (pencerminan) dari image suatu objek. Image mirror untuk refleksi 2D dibuat relatif terhadap sumbu dari refleksi dengan memutar 180 derajat terhadap refleksi. Sumbu refleksi dapat dipilih pada bidang x,y.
Refleksi terhadap garis y=0, yaitu sumbu x dinyatakan dengan matriks berlawanan dengan posisi koordinat. Langkah :
– Objek diangkat
– Putar 180 derajat terhadap sumbu x dalam 3D
– Letakkan pada bidang x,y dengan posisi berlawanan
– Refleksi terhadap sumbu y membalikan koordinat dengan nilai y tetap.
Refleksi terhadap sumbu x dan y sekaligus dilakukan dengan refleksi pada sumbu x terlebih dahulu, hasilnya kemudia direfleksi terhadap sumbu y. Transformasi ini dinyatakan dengan :
• Refleksi ini sama dengan rotasi 180 derajat pada bidang xy dengan koordinat menggunakan titik pusat koordinat sebagai pivot point. Refleksi suatu objek terhadap garis y=x dinyatakan dengan bentuk matriks Refleksi terhadap garis y=-x dapat dilakukan dengan tahap :
– Rotasi 45 derajat searah jarum jam
– Refleksi terhadap axis y
– Rotasi 90 derajat berlawanan arah dengan jarum jam.

Shear
• Shear adalah bentuk transformasi yang membuat distorsi dari bentuk suatu objek, seperti menggeser sisi tertentu. Terdapat dua macam shear yaitu shear terhadap sumbu x dan shear terhadap sumbu y.


Transformasi Pada Program Java (Demo) :
case TRANSLATION:
tr.setToTranslation(p1.x-p.x, p1.y-p.y);
break;
case ROTATION:
double a = Math.atan2(p1.y-y0, p1.x-x0) - Math.atan2(p.y-y0, p.x-x0);
tr.setToRotation(a);
break;
case SCALING:
double sx = Math.abs((double)(p1.x-x0)/(p.x-x0));
double sy = Math.abs((double)(p1.y-y0)/(p.y-y0));
tr.setToScale(sx, sy);
break;
case SHEARING:
double shx = ((double)(p1.x-x0)/(p.x-x0))-1;
double shy = ((double)(p1.y-y0)/(p.y-y0))-1;
tr.setToShear(shx, shy);
break;
case REFLECTION:
tr.setTransform(-1,0,0,1,0,0);
break;Source : Computer Graphics Using Java™ 2D and 3D
by Hong Zhang, Y. Daniel Liang – Armstrong, Prentice Hall.
import java.awt.*;
import java.awt.geom.*;
import java.awt.event.*;
import java.util.*;
import javax.swing.*;
public class Transformations extends JApplet
implements ActionListener {
public static void main(String s[]) {
JFrame frame = new JFrame();
frame.setTitle("Affine Transforms");
frame.setDefaultCloseOperation(JFrame.EXIT_ON
_CLOSE);
JApplet applet = new Transformations();
applet.init();
frame.getContentPane().add(applet);
frame.pack();
frame.setVisible(true);
{
TransformPanel panel = null;
public void init() {
JMenuBar mb = new JMenuBar();
setJMenuBar(mb);
JMenu menu = new JMenu("Transforms");
mb.add(menu);
JMenuItem mi = new JMenuItem("Translation");
mi.addActionListener(this);
menu.add(mi);
mi = new JMenuItem("Rotation");
mi.addActionListener(this);
menu.add(mi);
mi = new JMenuItem("Scaling");
mi.addActionListener(this);
menu.add(mi);
mi = new JMenuItem("Shearing");
mi.addActionListener(this);
menu.add(mi);
mi = new JMenuItem("Reflection");
mi.addActionListener(this);
menu.add(mi);
panel = new TransformPanel();
getContentPane().add(panel);
{public void actionPerformed(ActionEvent ev) {
String command = ev.getActionCommand();
if ("Translation".equals(command)) {
panel.transformType = panel.TRANSLATION;
} else if ("Rotation".equals(command)) {
panel.transformType = panel.ROTATION;
} else if ("Scaling".equals(command)) {
panel.transformType = panel.SCALING;
} else if ("Shearing".equals(command)) {
panel.transformType = panel.SHEARING;
} else if ("Reflection".equals(command)) {
panel.transformType = panel.REFLECTION;
{
{
{
class TransformPanel extends JPanel implements MouseListener,
MouseMotionListener {
static final int NONE = 0;
static final int TRANSLATION = 1;
static final int ROTATION = 2;
static final int SCALING = 3;
static final int SHEARING = 4;
static final int REFLECTION = 5;
int transformType = NONE;
Shape drawShape = null;
Shape tempShape = null;
Point p = null;
int x0 = 400;
int y0 = 300;
public TransformPanel() {
super();
setPreferredSize(new Dimension(800, 600));
setBackground(Color.white);
drawShape = new Rectangle(-50,-50,100,100);
addMouseListener(this);
addMouseMotionListener(this);
{public void paintComponent(Graphics g) {
super.paintComponent(g);
Graphics2D g2 = (Graphics2D)g;
g2.translate(x0, y0);
g2.drawLine(-200,0,200,0);
g2.drawLine(0,-200,0,200);
g2.draw(drawShape);
{
public void mouseClicked(MouseEvent ev) {
{
public void mouseEntered(MouseEvent ev) {
{
public void mouseExited(MouseEvent ev) {
{
public void mousePressed(MouseEvent ev) {
p = ev.getPoint();
{
public void mouseMoved(MouseEvent ev) {
{
public void mouseDragged(MouseEvent ev) {
Point p1 = ev.getPoint();
AffineTransform tr = new AffineTransform();
switch (transformType) {
case TRANSLATION:
tr.setToTranslation(p1.x-p.x, p1.y-p.y);
break;
case ROTATION:
double a = Math.atan2(p1.y-y0, p1.x-x0) - Math.atan2(p.y-y0, p.x-x0);
tr.setToRotation(a);
break;
case SCALING:
double sx = Math.abs((double)(p1.x-x0)/(p.x-x0));
double sy = Math.abs((double)(p1.y-y0)/(p.y-y0));
tr.setToScale(sx, sy);
break;
case SHEARING:
double shx = ((double)(p1.x-x0)/(p.x-x0))-1;
double shy = ((double)(p1.y-y0)/(p.y-y0))-1;
tr.setToShear(shx, shy);
break;
case REFLECTION:
tr.setTransform(-1,0,0,1,0,0);
break;
{
Graphics2D g = (Graphics2D)getGraphics();
g.setXORMode(Color.white);
g.translate(x0, y0);
if (tempShape != null)
g.draw(tempShape);
tempShape = tr.createTransformedShape(drawShape)