Lompat ke isi

Scalable Vector Graphics: Perbedaan antara revisi

Dari Wikipedia bahasa Indonesia, ensiklopedia bebas
Jelajahi riwayat secara interaktif
← Revisi sebelumnya
Konten dihapus Konten ditambahkan
VisualTeks wiki
Menyisipkan huruf "l" kecil pada kata "Word", sehingga kata tersebut akan menjadi "World".
Tag: Suntingan perangkat seluler Suntingan peramban seluler
Tidak ada ringkasan suntingan
 
(13 revisi perantara oleh 10 pengguna tidak ditampilkan)
Baris 1: Baris 1:
{{Infobox file format
{{Infobox file format
| name = Scalable Vector Graphics
| name = SVG
| icon =
| icon = [[File:SVG Logo.svg|100px]]
| logo =
| icon_size = 100px
⚫
| iconcaption =
| screenshot =
| screenshot =
| caption =
| caption =
| extension = <tt>.svg</tt>, <tt>.svgz</tt>
| _noextcode = on
| extensions = <code>.svg</code>, <code>.svgz</code>
| mime = image/svg+xml<ref>[http://www.w3.org/TR/SVGMobile12/mimereg.html M Media Type registration for image/svg+xml]</ref>
| type code =
| _nomimecode = on
| mime = <code>image/svg+xml</code><ref>{{cite web |title=Media Type Registration for image/svg+xml |url=http://www.w3.org/TR/SVG/mimereg.html |publisher=[[World Wide Web Consortium|W3C]] |access-date=5 February 2014 |archive-date=19 February 2014 |archive-url=https://web.archive.org/web/20140219180154/http://www.w3.org/TR/SVG/mimereg.html |url-status=live }}</ref><ref>{{cite journal |title=XML Media Types |date=January 2001 |url=http://tools.ietf.org/html/rfc3023#section-8.19 |access-date=5 February 2014 |last1=St. Laurent |first1=Simon |last2=Makoto |first2=Murata |last3=Kohn |first3=Dan |doi=10.17487/RFC3023 |doi-access=free |website=IETF Datatracker |archive-date=24 August 2011 |archive-url=https://web.archive.org/web/20110824200159/http://tools.ietf.org/html/rfc3023#section-8.19 |url-status=live }}</ref>
⚫
| uniform type =
| type_code = <!-- {{hlist |"svg" |"svgz"}} -->
| uniform_type = <code>public.svg-image</code>
| conforms_to = <!--<code>public.image</code><br /><code>public.xml</code>-->
| magic =
| magic =
| owner = [[World Wide Web Consortium]]
| developer = [[World Wide Web Consortium|W3C]]
| released = {{Start date|2001|09|4|df=yes}}
| released = {{start date and age|df=yes|paren=yes|2001|09|04}}
| latest_release_version = 1.1 (Edisi Kedua)
| latest release version = 1.2T
| latest_release_date = {{start date and age|2011|08|16|df=yes}}
| latest release date = [[10 Agustus]], [[2006]]
| genre = [[Gambar vektor|format gambar vektor]]
| genre = [[Grafik vektor]]
| container for =
| container_for =
| contained by =
| contained_by =
| extended from = [[XML]]
| extended_from = [[XML]]
| extended to =
| extended_to =
| standard =
| standard = {{URL|https://www.w3.org/TR/SVG/|W3C SVG}}
| url = [http://www.w3.org/Graphics/SVG/ w3.org/Graphics/SVG/]
| open = Yes
| url = {{URL|https://www.w3.org/Graphics/SVG/}}
}}
}}

'''Scalable Vector Graphics (SVG)''' adalah format gambar yang menggunakan [[XML]] (''Extensible Markup Language'') sebagai dasar untuk membentuk gambar vektor dua dimensi. SVG adalah format gambar yang dikembangkan oleh World Wide Web Consortium (W3C) sejak tahun 1999.
'''Scalable Vector Graphics (SVG)''' adalah format gambar yang menggunakan [[XML]] (''Extensible Markup Language'') sebagai dasar untuk membentuk gambar vektor dua dimensi. SVG adalah format gambar yang dikembangkan oleh World Wide Web Consortium (W3C) sejak tahun 1999.


Sebuah gambar dengan format SVG disimpan dalam bentuk file XML. Ini berarti, SVG dapat dicari, di-index, ditulis dengan bahasa pemograman dan dikompres. Karena berbasis XML, SVG dapat dibuat dan disunting dengan aplikasi teks apa saja.
Sebuah gambar dengan format SVG disimpan dalam bentuk file XML. Ini berarti, SVG dapat dicari, di-index, ditulis dengan bahasa pemograman dan dikompres. Karena berbasis XML, SVG dapat dibuat dan disunting dengan aplikasi teks apa saja.


Sejumlah [[peramban web]] populer seperti [[Mozilla Firefox]], [[Internet Explorer]], [[Google Chrome]], [[Opera]], dan [[Safari]] sudah mulai mendukung penggunakan format SVG.
Sejumlah [[peramban web]] populer seperti [[Mozilla Firefox]], [[Internet Explorer]], [[Google Chrome]], [[Opera (peramban web)|Opera]], dan [[Safari (peramban web)|Safari]] sudah mulai mendukung penggunakan format SVG.


== Pendahuluan ==
== Pendahuluan ==
SVG telah direkomendasikan oleh [[World Wide Web Consortium]] ([[W3C]]) untuk menampilkan grafik serta mendeskripsikan [[gambar]] 2 [[dimensi]] dalam pengembangan [[web]] yang berbasis XML.<ref name="widi">Yudha Widiatmoko, Fathul Wahid (2006), ''APLIKASI WEB DATA SPASIAL KEPENDUDUKAN INDONESIA DENGAN SCALABLE VECTOR GRAPHICS (SVG)'', Media Informatika. [[ISSN]]: 0854-4743</ref> SVG memperbolehkan tiga tipe dari [[objek]] [[grafis]], yaitu bentuk vektor grafis (misalkan jalur yang terdiri dari garis lurus dan [[kurva]]), gambar dan teks. Hasil dari SVG dapat juga interaktif dan dinamis. [[Animasi]] dapat didefinisikan dan ditimbulkan secara menempelkan elemen animasi SVG pada isi SVG) atau dengan menggunakan ''skripting''. SVG dapat digunakan untuk menghasilkan berbagai macam variasi dari objek grafis, dan juga menyediakan bentuk dasar [[umum]] seperti [[bujur sangkar]] dan [[elips]]. SVG memberikan pengendalian kualitas melalui sistem [[koordinat]] dari objek grafis yang telah didefinisikan dan transformasi yang akan digunakan selama proses render.<ref>Beny Yulkurniawan Victorio Nasution (2005) [http://www.si.its.ac.id/Penelitian/JURNAL/Beni.pdf PERANCANGAN DAN PEMBUATAN SISTEM KONVERSI DATA GEOGRAFIS PADA REHABILITASI HUTAN DAN LAHAN ABUPATEN KUTAI BARAT BERBASIS XML DAN JAVA] Diakses pada 08 Mei 2010.</ref>
SVG telah direkomendasikan oleh [[World Wide Web Consortium]] ([[W3C]]) untuk menampilkan grafik serta mendeskripsikan [[gambar]] 2 [[dimensi]] dalam pengembangan [[web]] yang berbasis XML.<ref name="widi">Yudha Widiatmoko, Fathul Wahid (2006), ''APLIKASI WEB DATA SPASIAL KEPENDUDUKAN INDONESIA DENGAN SCALABLE VECTOR GRAPHICS (SVG)'', Media Informatika. [[ISSN]]: 0854-4743</ref> SVG memperbolehkan tiga tipe dari [[objek]] [[grafis]], yaitu bentuk vektor grafis (misalkan jalur yang terdiri dari garis lurus dan [[kurva]]), gambar dan teks. Hasil dari SVG dapat juga interaktif dan dinamis. [[Animasi]] dapat didefinisikan dan ditimbulkan secara menempelkan elemen animasi SVG pada isi SVG) atau dengan menggunakan ''skripting''. SVG dapat digunakan untuk menghasilkan berbagai macam variasi dari objek grafis, dan juga menyediakan bentuk dasar umum seperti [[bujur sangkar]] dan [[elips]]. SVG memberikan pengendalian kualitas melalui sistem [[koordinat]] dari objek grafis yang telah didefinisikan dan transformasi yang akan digunakan selama proses render.<ref>Beny Yulkurniawan Victorio Nasution (2005) [http://www.si.its.ac.id/Penelitian/JURNAL/Beni.pdf PERANCANGAN DAN PEMBUATAN SISTEM KONVERSI DATA GEOGRAFIS PADA REHABILITASI HUTAN DAN LAHAN ABUPATEN KUTAI BARAT BERBASIS XML DAN JAVA]{{Pranala mati|date=Mei 2021 |bot=InternetArchiveBot |fix-attempted=yes }} Diakses pada 08 Mei 2010.</ref>


Penyimpanan berkas ([[file]]) SVG dilakukan dengan cara memberi nama ekstensinya dengan “.svg” (memakai huruf kecil semua), dan untuk menyimpan file SVG yang terkompresi memakai ekstensi “.svgz” (semua memakai huruf kecil).<ref name="widi"/>
Penyimpanan berkas ([[file]]) SVG dilakukan dengan cara memberi nama ekstensinya dengan “.svg” (memakai huruf kecil semua), dan untuk menyimpan file SVG yang terkompresi memakai ekstensi “.svgz” (semua memakai huruf kecil).<ref name="widi"/>
Baris 36: Baris 40:
== Keuntungan Penggunaan SVG ==
== Keuntungan Penggunaan SVG ==
[[Berkas:Svg.svg|ka|jmpl|Contoh gambar .svg]]
[[Berkas:Svg.svg|ka|jmpl|Contoh gambar .svg]]
Keuntungan penggunaan SVG dibanding format gambar yang lain<ref>ilmu-komputer.net [http://www.ilmu-komputer.net/internet/pengantar-svg/ Pengantar SVG] Diakses pada 08 Mei 2010.</ref>:
Keuntungan penggunaan SVG dibanding format gambar yang lain:<ref>ilmu-komputer.net [http://www.ilmu-komputer.net/internet/pengantar-svg/ Pengantar SVG] {{Webarchive|url=https://web.archive.org/web/20100526011135/http://ilmu-komputer.net/internet/pengantar-svg/ |date=2010-05-26 }} Diakses pada 08 Mei 2010.</ref>
* File sumber SVG dapat dibaca dan modifikasi dengan menggunakan hampir semua tool/text (misalnya notepad).
* File sumber SVG dapat dibaca dan modifikasi dengan menggunakan hampir semua tool/text (misalnya Notepad).
* File sumber SVG berukuran lebih kecil dan dapat dikompresi dibanding dengan format gambar [[JPEG]] dan [[GIF]].
* File sumber SVG berukuran lebih kecil dan dapat dikompresi dibanding dengan format gambar [[JPEG]] dan [[GIF]].
* Gambar dalam format SVG bersifat scalable/diresizing.
* Gambar dalam format SVG bersifat ''scalable''/di-resizing.
* Gambar dalam format SVG dapat dicetak dengan kualitas yang tinggi dan sama baiknya pada berbagai resolusi.
* Gambar dalam format SVG dapat dicetak dengan kualitas yang tinggi dan sama baiknya pada berbagai resolusi.
* Gambar dalam format SVG bersifat zoomable. Setiap bagian dari gambar dapat di zoom tanpa degradasi mutu.
* Gambar dalam format SVG bersifat ''zoomable''. Setiap bagian dari gambar dapat di zoom tanpa mengurangi mutu.
* Text dalam SVG “selectable” dan “searchable” (sangat berguna dalam peta).
* Text dalam SVG “selectable” dan “searchable” (sangat berguna dalam peta).
* SVG dapat bekerja dengan [[Teknologi]] [[Java]].
* SVG dapat bekerja dengan [[Teknologi]] [[Java]].
Baris 54: Baris 58:


== Contoh File SVG ==
== Contoh File SVG ==
“Hello World” dalam SVG memiliki kode seperti di bawah ini:<ref name="maj">Mohammad Athar Januar, [http://ilmukomputer.org/2008/11/25/pengantar-scalable-vector-graphics-svg/ Pengantar Scalable Vector Graphics (SVG)] (2008). ilmukomputer.org</ref>
“Hello World” dalam SVG memiliki kode seperti di bawah ini:<ref name="maj">Mohammad Athar Januar, [http://ilmukomputer.org/2008/11/25/pengantar-scalable-vector-graphics-svg/ Pengantar Scalable Vector Graphics (SVG)]{{Pranala mati|date=Mei 2021 |bot=InternetArchiveBot |fix-attempted=yes }} (2008). ilmukomputer.org</ref>
<source lang="xml">
<syntaxhighlight lang="xml">
<?xml version="1.0" encoding="iso-8859-1"?>
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD svg 20000303 Stylable//EN"
<!DOCTYPE svg PUBLIC "-//W3C//DTD svg 20000303 Stylable//EN"
Baris 61: Baris 65:
<svg width="100px" height="50px">
<svg width="100px" height="50px">
<text style="fill:red" x ="10" y="20">Hello World !</text>
<text style="fill:red" x ="10" y="20">Hello World !</text>
</svg></source>
</svg></syntaxhighlight>
Setelah disimpan dalam format .svg, file tersebut dapat dibuka oleh browser.
Setelah disimpan dalam format .svg, file tersebut dapat dibuka oleh browser.


Revisi terkini sejak 4 September 2024 10.03

SVG
Jenis MIMEimage/svg+xml[1][2]
Rilis pertama4 September 2001; 23 tahun lalu (2001-09-04)
Rilis terbaru1.1 (Edisi Kedua) / 16 Agustus 2011; 13 tahun lalu (2011-08-16)
Jenis formatGrafik vektor
StandarW3C SVG
Situs webwww.w3.org/Graphics/SVG/

Scalable Vector Graphics (SVG) adalah format gambar yang menggunakan XML (Extensible Markup Language) sebagai dasar untuk membentuk gambar vektor dua dimensi. SVG adalah format gambar yang dikembangkan oleh World Wide Web Consortium (W3C) sejak tahun 1999.

Sebuah gambar dengan format SVG disimpan dalam bentuk file XML. Ini berarti, SVG dapat dicari, di-index, ditulis dengan bahasa pemograman dan dikompres. Karena berbasis XML, SVG dapat dibuat dan disunting dengan aplikasi teks apa saja.

Sejumlah peramban web populer seperti Mozilla Firefox, Internet Explorer, Google Chrome, Opera, dan Safari sudah mulai mendukung penggunakan format SVG.

Pendahuluan

[sunting | sunting sumber]

SVG telah direkomendasikan oleh World Wide Web Consortium (W3C) untuk menampilkan grafik serta mendeskripsikan gambar 2 dimensi dalam pengembangan web yang berbasis XML.[3] SVG memperbolehkan tiga tipe dari objek grafis, yaitu bentuk vektor grafis (misalkan jalur yang terdiri dari garis lurus dan kurva), gambar dan teks. Hasil dari SVG dapat juga interaktif dan dinamis. Animasi dapat didefinisikan dan ditimbulkan secara menempelkan elemen animasi SVG pada isi SVG) atau dengan menggunakan skripting. SVG dapat digunakan untuk menghasilkan berbagai macam variasi dari objek grafis, dan juga menyediakan bentuk dasar umum seperti bujur sangkar dan elips. SVG memberikan pengendalian kualitas melalui sistem koordinat dari objek grafis yang telah didefinisikan dan transformasi yang akan digunakan selama proses render.[4]

Penyimpanan berkas (file) SVG dilakukan dengan cara memberi nama ekstensinya dengan “.svg” (memakai huruf kecil semua), dan untuk menyimpan file SVG yang terkompresi memakai ekstensi “.svgz” (semua memakai huruf kecil).[3]

Keuntungan Penggunaan SVG

[sunting | sunting sumber]
Contoh gambar .svg

Keuntungan penggunaan SVG dibanding format gambar yang lain:[5]

  • File sumber SVG dapat dibaca dan modifikasi dengan menggunakan hampir semua tool/text (misalnya Notepad).
  • File sumber SVG berukuran lebih kecil dan dapat dikompresi dibanding dengan format gambar JPEG dan GIF.
  • Gambar dalam format SVG bersifat scalable/di-resizing.
  • Gambar dalam format SVG dapat dicetak dengan kualitas yang tinggi dan sama baiknya pada berbagai resolusi.
  • Gambar dalam format SVG bersifat zoomable. Setiap bagian dari gambar dapat di zoom tanpa mengurangi mutu.
  • Text dalam SVG “selectable” dan “searchable” (sangat berguna dalam peta).
  • SVG dapat bekerja dengan Teknologi Java.
  • SVG merupakan “open standard”.
  • SVG merupakan murni XML.

Perangkat Pendukung

[sunting | sunting sumber]

Bekerja sama dengan W3C, Adobe menjadi pendukung utama pengembangan SVG. Perusahaan ini membuat perangkat (tool) yang menggenerasikan gambar langsung ke kode SVG, yaitu ADOBE Illustrator, selain itu ada juga Adobe GoLive untuk mengedit kode SVG. Sementara itu, COREL juga memproduksi software pendukung SVG.[6]

SVG dalam WEB

[sunting | sunting sumber]

Konqueror adalah peramban web pertama yang mendukung format SVG sejak versi 3.2 yang dirilis pada Februari 2004.[7] Pada tahun 2011, peramban web populer dan beberapa peramban web kecil lainnya mulai mendukung penggunaan SVG meskipun hanya beberapa fungsi dasar.

Contoh File SVG

[sunting | sunting sumber]

“Hello World” dalam SVG memiliki kode seperti di bawah ini:[6] 

<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD svg 20000303 Stylable//EN"
"http://www.w3.org/TR/2000/03/WD-SVG-20000303/DTD/svg-20000303 stylable.dtd">
<svg width="100px" height="50px">
<text style="fill:red" x ="10" y="20">Hello World !</text>
</svg>

Setelah disimpan dalam format .svg, file tersebut dapat dibuka oleh browser.

Referensi

[sunting | sunting sumber]
  1. ^ "Media Type Registration for image/svg+xml". W3C. Diarsipkan dari versi asli tanggal 19 February 2014. Diakses tanggal 5 February 2014. 
  2. ^ St. Laurent, Simon; Makoto, Murata; Kohn, Dan (January 2001). "XML Media Types". IETF Datatracker. doi:10.17487/RFC3023 alt=Dapat diakses gratis. Diarsipkan dari versi asli tanggal 24 August 2011. Diakses tanggal 5 February 2014. 
  3. ^ a b Yudha Widiatmoko, Fathul Wahid (2006), APLIKASI WEB DATA SPASIAL KEPENDUDUKAN INDONESIA DENGAN SCALABLE VECTOR GRAPHICS (SVG), Media Informatika. ISSN: 0854-4743
  4. ^ Beny Yulkurniawan Victorio Nasution (2005) PERANCANGAN DAN PEMBUATAN SISTEM KONVERSI DATA GEOGRAFIS PADA REHABILITASI HUTAN DAN LAHAN ABUPATEN KUTAI BARAT BERBASIS XML DAN JAVA[pranala nonaktif permanen] Diakses pada 08 Mei 2010.
  5. ^ ilmu-komputer.net Pengantar SVG Diarsipkan 2010-05-26 di Wayback Machine. Diakses pada 08 Mei 2010.
  6. ^ a b Mohammad Athar Januar, Pengantar Scalable Vector Graphics (SVG)[pranala nonaktif permanen] (2008). ilmukomputer.org
  7. ^ Andreas Streichardt (16 September 2003). "KDE Conquers the Vectors with KSVG". KDE News. Diakses tanggal 11 February 2012. 

Pranala luar

[sunting | sunting sumber]
Diperoleh dari "https://id.wikipedia.org/w/index.php?title=Scalable_Vector_Graphics&oldid=26255955"