2. Pengembangan model file materi kuliah Matematika semigrup.htm
Pada halaman ini banyak terdapat gambar-gambar persamaan matematika berformat GIF dan JPG. Persamaan-persamaan matematika itu
kemudian dibuat dalam format .svg yang kemudian disisipkan ke dalam file aslinya menggantikan image-image grafis yang memiliki format GIF dan JPG.
Dalam pembuatan persamaan-persamaan matematika ini digunakan bantuan dari software sMArTH versi 0.05 SMARTH 2004 yang dapat didownload
gratis di
http:smarth.sourceforge.net
. Aplikasi ini berbasis Web dan memiliki ekstensi .svg. sMArTH mengharuskan PHP:Hypertext Prepocessor PHP
PHP 2003 terinstal di sistem dan menyarankan menggunakan webserver Apache APACHE 2002 karena Microsoft IIS tidak mendukung secara penuh
aplikasi ini. Karena juga menggunakan PHP maka sMArTH hanya dapat dijalankan secara online di Internet atau secara offline tetapi melalui
webserver lokal. sMArTH memiliki kemampuan menciptakan persamaan-persamaan
matematis seperti Microsoft Equation pada Ms Word. Hasil dari persamaan yang talah dibuat dapat disimpan dalam format MathML, LaTEX, dan SVG.
Gambar 12 Aplikasi sMArTH smarth.svg
Persamaan matematika yang tampak seperti Gambar 12 dibuat dengan menggunakan aplikasi sMArTH dan menghasilkan script seperti dibawah ini:
?xml version=1.0 encoding=UTF-8 standalone=no? ?xml-stylesheet href=equation.css type=textcss?
DOCTYPE svg PUBLIC -W3CDTD SVG 20010719EN http:www.w3.orgTR2001PR-SVG-20010719DTDsvg10.dtd
svg x=10 y=2 width=59.4375 height=27.34404182434082 viewBox=0 0 59.4375 27.34404182434082
svg x=0 y=0 width=16 height=25 viewBox=0 0 16 25 text baseline-shift=-80 x=2 y=2 startOffset=0
class=texteltStext svg svg x=16 y=2.0928955078125 width=19.28125
height=25.25114631652832 viewBox=0 0 19.28125 25.25114631652832
text baseline-shift=-80 x=2 y=2 startOffset=0 class=Operator≠text svg
svg x=35.28125 y=2.0928955078125 width=24.15625 height=25 viewBox=0 0 24.15625 25
text baseline-shift=-80 x=2 y=2 startOffset=0 class=Operator∅text svg
svg
Aplikasi sMArTH selain harus dijalankan pada browser, ia juga menghendaki terinstalnya font khusus pada windows yaitu CODE2000
CODE2000 2004. Persamaan-persamaan matematika yang ada tidak mengandung link ke halaman lain. Sehingga tidak memerlukan tambahan
script untuk membuat link ke halaman lain. Terdapat 25 persamaan matematika yang akan disisipkan ke halaman semigrup.htm.
Terdapat pula menu-menu yang merupakan link menuju halaman lain. Menu ini terletak di bagian awal dari halaman semigrup.htm yang pada
halaman aslinya dibuat dengan format JPG dimana tiap menu diwakili oleh satu elemen gambar berformat JPG seperti tampak pada Gambar 13. Menu-
menu ini kemudian dibuat dalam format SVG dengan hanya dijadikan satu elemen SVG saja seperti tampak pada Gambar 14.
Gambar 13 Elemen menu pada semigrup.htm berformat JPG
Gambar 14 Elemen menu pada semigrup.htm berformat SVG
Elemen menu seperti pada Gambar 14 yang berformat SVG akan memiliki script seperti berikut:
?xml version=1.0 standalone=no? DOCTYPE svg PUBLIC -W3CDTD SVG 20010719EN
http:www.w3.orgTR2001PR-SVG-20010719DTDsvg10.dtd svg width=18cm height=.5cm viewBox=0 0 1800 50
descMenu Linkdesc rect x=0 y=0 width=1800 height=50 fill=0359C2
a xlink:href=..semigrup.htm name=Pengantar id=Pengantar target=_parent
text x=12 y=35 font-family=Verdana font-size=32 fill=whiteSEMIGRUP
DAN MONOIDtexta
a xlink:href=..invers.htm name=Pengantar id=Pengantar target=_parent
text x=475 y=35 font-family=Verdana font-size=32 fill=whiteINVERS
DALAM MONOIDtexta
a xlink:href=..pemetaan.htm name=Pengantar id=Pengantar target=_parent
text x=940 y=35 font-family=Verdana font-size=32 fill=whitePEMETAAN
INVERStexta a xlink:href=..grup.htm name=Pengantar id=Pengantar
target=_parent text x=1300 y=35 font-family=Verdana font-size=32
fill=whiteKONSEP GRUPtexta
a xlink:href=..subgrup.htm name=Pengantar id=Pengantar target=_parent
text x=1590 y=35 font-family=Verdana font-size=32 fill=whiteSUBGRUPtexta
svg
Penjelasan program:
a xlink:href=..semigrup.htm name=Pengantar id=Pengantar target=_parent
text x=12 y=35 font-family=Verdana font-size=32 fill=whiteSEMIGRUP
DAN MONOIDtexta
Membuat teks bertuliskan SEMIGRUP DAN MONOID yang akan menjadi
link ke halaman semigrup.htm.
Seluruh elemen SVG kemudian disatukan kedalam sebuah halaman Web berformat HTML dengan nama semigrup.htm menggunakan teknik
penggabungan antara SVG dengan HTML.
B. Menyatukan file-file SVG dengan HTML