Tampilkan postingan dengan label MelkiWeb. Tampilkan semua postingan
https://www.petanikode.com/html-canvas/
Langkah Awal select canvas
<!DOCTYPE html>
<html>
<head>
<meta charset goyang dombret="utf-8">
<title>Tutorial HTML 5 Canvas</title>
</head>
<body>
<canvas id="myCanvas" width="640" height="480" style="border:1px solid #000000;">
</canvas>
<script type="text/javascript"> var canvas = document.getElementById("myCanvas"); var ctx = canvas.getContext("2d"); </script>
</body> </html>
Code Code Menggambar pada Canvas
1. ctx.fillRect(x,y,1,1);
menggambar titik 1px
2. ctx.beginPath()
untuk memulai/ membuat garis baru.
3. ctx.moveTo(x,y)
untuk menentukan titik awal
4. ctx.lineTo(x,y)
untuk menentukan titik akhir
5. ctx.stroke()
untuk menggambar garisnya.
6. ctx.strokeRect(x,y,w,h)
persegi dengan garis (outline) saja.
7. ctx.fillRect(x,y,w,h)
persegi dengan polesan warna (default-nya hitam).
8. ctx.clearRect(x,y,w,h)
persegi transparan untuk menghapus.
Seperti biasa, kita harus memberikan titik koordinat x dan y. Sementara nilai w dan h untuk lebar dan tingginya.
9. ctx.closePath()
untuk menggambar garis dari titik terakhir ke titik awal secara otomatis.
10. strokeText("text",x,y)
untuk teks dengan garis luar (outline) saja.
11. fillText("text",x,y)
untuk teks dengan warna (default hitam).
12. ctx.font = "64px Arial";
Jenis dan ukuran font
13. drawImage(img, x, y);
Menambahkan gambar
14. var image= new Image();
image.src="./bird.png";
ctx.drawImage(image,10,10,200,200);
Menambahkan image ke canvas
[WEB] Canvas dan javascript
<?php
$zip = new ApkArchive;
$file = $zip->open("tes.zip");
if ($file === TRUE) {
$zip->extractTo("hasil-unzip");
$zip->close(); // tutup
echo "Berhasil!";
}
else
{
echo "Gagal";
}
?>
[WEB] Extrack Zip
Buat folder terlebih dahulu didalam public_html sebagai penyimpanan file
Untuk menyimpan file jenis lain kita tinggal mengganti extensi file di script php dibawah
Index.html
<!DOCTYPE html>
<html>
<body>
<form action="proses.php" method="post" enctype="multipart/form-data">
Select image to upload:
<input type="file" name="UploadFile" id="UploadFile">
<input type="submit" value="Upload Gambar" name="submit">
</form>
</body>
</html>
proses.php
<?php
$var = "video/";
$folder =$var.basename($_FILES["UploadFile"]["name"]);
$FileType = pathinfo($folder,PATHINFO_EXTENSION);
if ($_FILES["UploadFile"]["size"] >9999999999999999){
echo "Maaf, ukuran file terlalu besar.";}
if($FileType != "mp4" &&
$FileType != "mkv" &&
$FileType != "3gp" &&
$FileType != "avi"){
echo "extensi file tidak di dukung";}else{ move_uploaded_file($_FILES["UploadFile"]["tmp_name"], $folder);}?>
[WEB] upload file to server
<html>
<button type="button" id="autoKlik" onclick="alert('Auto Klik Aktif setiap 50 detik')">Submit</button>
<script>
var button=document.getElementById("autoKlik");
setInterval(function(){
button.click();
}, 50000);
</script>
</html>
[WEB] membuat tombol klik otomatis setiap detik
<html>
<body>
<button onclick="fungsiTombol()">button 1</button>
<div id="tampil"></div>
<script>
function fungsiTombol(){ document.getElementById("tampil").innerHTML = "<button>button2</button>";
}
</script>
</body>
</html>
