HTML5 canvas: Perbedaan antara revisi

Jelajahi riwayat secara interaktif

← Revisi sebelumnya

Konten dihapus Konten ditambahkan

VisualTeks wiki

Revisi per 30 Agustus 2017 16.50 sunting 94.254.242.243 (bicara) Tidak ada ringkasan suntingan Tag: Suntingan perangkat seluler Suntingan peramban seluler ← Revisi sebelumnya		Revisi terkini sejak 26 Juli 2024 03.15 sunting balikkan Kim Nansa (bicara \| kontrib) 3.162 suntingan Fitur saranan suntingan: 3 pranala ditambahkan. Tag: VisualEditor Tugas pengguna baru Disarankan: tambahkan pranala
(9 revisi perantara oleh 6 pengguna tidak ditampilkan)
Baris 1: {{terjemahan\|en\|Canvas element\|version=}}Elemen kanvas adalah bagian dari [[HTML5]] dan memungkinkan untuk dinamis, skrip render bentuk 2D dan [[gambar bitmap]]. Ini adalah tingkat rendah, model prosedural yang update bitmap dan tidak memiliki grafik adegan built-in. == Sejarah == Canvas awalnya diperkenalkan oleh [[Apple Inc.\|Apple]] untuk digunakan dalam komponen sendiri OS [[Mac]] X [[WebKit]] pada tahun 2004,<ref>{{cite web \| url=http://ln.hixie.ch/?start=1089635050&count=1 \| author=Ian Hixie \| title=Extending HTML \| date=2004-07-12 \| accessdate=2012-12-27 \| archive-date=2018-06-16 \| archive-url=https://web.archive.org/web/20180616080427/http://ln.hixie.ch/?start=1089635050&count=1 \| dead-url=no }}</ref> menggerakkan aplikasi seperti widget Dashboard dan browser Safari. Kemudian, pada tahun 2005 itu diadopsi dalam versi 1,8 browser Gecko,<ref>{{cite web \| url=https://developer.mozilla.org/en/DOM/HTMLCanvasElement \| author=Mozilla Developer Connection \| title=HTMLCanvasElement \| accessdate=2012-12-27 \| archive-date=2011-06-04 \| archive-url=https://web.archive.org/web/20110604062413/https://developer.mozilla.org/en/DOM/HTMLCanvasElement \| dead-url=yes }}</ref> dan Opera pada tahun 2006,<ref>[{{Cite web \|url=http://www.opera.com/docs/changelogs/windows/900/ \|title=Opera 9.0 changelog] \|access-date=2012-12-27 \|archive-date=2012-09-10 \|archive-url=https://archive.today/20120910/http://www.opera.com/docs/changelogs/windows/900/ \|dead-url=no }}</ref> dan standar oleh Teknologi [[Hiperteks\|Hypertext]] [[Aplikasi web\|Aplikasi Web]] Kelompok Kerja (WHATWG) pada spesifikasi yang diusulkan baru untuk teknologi web generasi berikutnya.{{Citation needed\|date=Decmber 2012}} == Penggunaan == Baris 8 ⟶ 10: Kode berikut membuat elemen canvas dalam sebuah halaman HTML: <br/> <~~source~~syntaxhighlight lang="html5"> <canvas id="example" width="200" height="200"> Teks ini ditampilkan jika browser Anda tidak mendukung HTML5 canvas.<br/> </canvas> </syntaxhighlight> ~~</source>~~ <br/> Menggunakan JavaScript, anda dapat menggambar pada kanvas: <br/> <~~source~~syntaxhighlight lang="javascript"> var example = document.getElementById('example'); var context = example.getContext('2d'); context.fillStyle = 'red'; context.fillRect(30, 30, 50, 50); </syntaxhighlight> ~~</source>~~ <br/> Kode ini menggambar persegi panjang merah di layar. == Dukungan == Unsur ini didukung oleh versi terbaru [[Mozilla Firefox]], [[Google Chrome]], [[Internet Explorer]], [[Safari (peramban web)\|Safari]], [[Konqueror]] dan [[Opera (peramban web)\|Opera]].<ref>{{cite web\|url=http://dev.opera.com/articles/view/svg-or-canvas-choosing-between-the-two/\|title=SVG or Canvas? Сhoosing between the two\|last=Sucan\|first=Mihai\|date=4 Feb, 2010\|publisher=[[Opera Software]]\|accessdate=16 January 2013\|archive-date=2010-06-23\|archive-url=https://web.archive.org/web/20100623002104/http://dev.opera.com/articles/view/svg-or-canvas-choosing-between-the-two/\|dead-url=no}}</ref>Versi lama dari Internet Explorer, versi 8 dan sebelumnya tidak mendukung <code> canvas </code>, namun plugin Google dan Mozilla juga tersedia.<ref>{{cite web\|url=http://arstechnica.com/software/news/2008/08/mozilla-drags-ie-into-the-future-with-canvas-element-plugin.ars\|title=Mozilla drags IE into the future with Canvas element plugin\|date=19 Aug, 2008\|publisher=[[Ars Technica]]\|accessdate=16 January 2013\|archive-date=2012-05-06\|archive-url=https://web.archive.org/web/20120506081545/http://arstechnica.com/software/news/2008/08/mozilla-drags-ie-into-the-future-with-canvas-element-plugin.ars\|dead-url=no}}</ref> Sebuah gambaran rinci dari<code> canvas </code> support mengenai browser yang paling populer (sebagai persentase dari pangsa pasar per September 2012, diambil dari [http://en.wiki-indonesia.club/wiki/Usage_share_of_web_browsers#StatCounter_.28July_2008_to_present.29\|Penggunaan pangsa browser web] {{Webarchive\|url=https://web.archive.org/web/20230811151604/https://en.wiki-indonesia.club/wiki/Usage_share_of_web_browsers#StatCounter_.28July_2008_to_present.29{{!}}Penggunaan \|date=2023-08-11 }})<ref>{{cite web\|url=http://caniuse.com/#search=canvas\|title=Compatibility tables for the support of HTML5, CSS3, SVG\|publisher=\|date=\|accessdate=16 January 2013\|archive-date=2017-04-08\|archive-url=https://web.archive.org/web/20170408034823/http://caniuse.com/#search=canvas\|dead-url=no}}</ref> {\| class="wikitable" style="text-align: center; background-color:#FFFFFF; margin-left:5px;" Baris 52 ⟶ 54: * [[HTML5]] * [[HTML5 video]] {{Authority control}} [[Kategori:HTML5]] [[Kategori:~~Javascript~~JavaScript]]