HTML5 Canvas Ders-1 Giriş
UstaDerslik Soru-Cevap Yararlı Araçlar
arama ikon
Diller
Türkçe Türkçe

bilgi UstaDerslik
Bu uyari kutusudur.
Tamam
Anasayfa
İletişim
Üyeler

HTML5 Canvas Ders-1 Giriş

profil
cArleone
BEĞEN(0)
BEĞENME(0)
GÖRÜNTÜLENME(4540)
RAPOR ET
HTML5le gelen canvas tagını anlatmaya başlayacam.Öncelikle canvas ne onla başlayalım.

Canvas tuval demek.Sayfa içinde bir tuval oluşturuyoruz ve istediğimiz gibi şekillendiriyoruz.Bunu neler için kullanabiliriz.Etkileşimli uygulama yapmak için veya oyun yapmak için vs.Canvas tagını kullanmak için Javascript bilmeniz şart.Yoksa zorlanırsınız.

Şimdi sayfamıza canvas nasıl oluştururuz ona bakalım.

<canvas id="canvas" width="578" height="200"></canvas>


Burada id canvasa erişmek için.Width genişliği height yüksekliği.

Canvası yarattık şimdi buna erişip burda çizim yapacğımızı belirtelim.

   
<script type="text/javascript">
var canvas = document.getElementById('canvas');
var cizim = canvas.getContext('2d');
</script>


Burda canvasa erişip getContext ile 2d çizim yapacaz dedik.Daha 3d resmileşmedi bildiğim kadarıyla.

Genel örnek :
		<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>cArleone</title>
<style type="text/css">
#canvas{border:2px solid #333;}
</style>
</head>
<body>
<canvas id="canvas" width="578" height="200"></canvas><script type="text/javascript">
var canvas = document.getElementById('canvas');
var cizim = canvas.getContext('2d');
</script>
</body>
</html>



Kod
Kalın
Vurgu
Resim
Video
Url
CEVAPLA
Tüm Hakları Saklıdır. ©Arleone 2013-2014 UstaDerslik






Giriş
Şifremi Unuttum...
Şifre Talep
  Kuralları Kabul Ediyorum.
Kaydol