Panduan pemula membuat gambar rumah di notpad ++

Assalamu alaikum warahmatullahi wabarakatuh.....

Hay, sahabat dumay. saya ngeblog bareng amran....

Kali ini saya membuat artikel tentang cara membuat gambar rumah di notpad ++ dengan HTML5.

untuk menghasilkan suatu gambar yang baik perlu perhitungan yang matang, ketelitian dan semangat yang berapi - api. hehehe... bercanda....

pembuatannya itu yah gampang - gampang sulit, tinggal pemahaman masing - masing individu.

jadi saran saya, yah kalau sedang nyekrip, yah disaat yang tepat jangan disaat marahan dengan pacar,. bakalan gatot {gagal total} dan nikmati segala prosesnya. di jamin tidak bagal bosan dan semakin kalian menikmatinya semakin NIKMAT.. begitu kata pak sofyan mangalus...... 

Tips :
"Bayangkan saja sedang mengerjakan sesuatu yang kalian sukai."

langsung saja ke pokok permasalahan, yaitu membuat gambar rumah di notpad ++ dengan HTML5 :

1. peratama tama bukalah software notpad ++ kamu.

2. masukan script di bawah ini untuk membuat canvas gambar.

<center>
    <canvas id="myCanvas" width="600" height="500"></canvas>
    <style>
    canvas {border: 2px solid green;}
    </style>
<script>
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');



</script></center>

3. kemudian membuat garis yang nantinya menjadi sebuah gambar rumah.

4. selanjutnya langkah pada saat membuat gambar, saya sarankan anda untuk membuatnya di mulai dari bumbungan rumah atau atap rumah.

5. pertanyaannya mengapa harus dari atas kenapa tidak mulai dari membuat pondasinya kayak tukang rumah gitu....

6. tetapi apabila kita mulai dari atas, tidak terlalu sulit untuk menyesuaikan yang di bawahnya. itu tips dari saya sih, tergantung dari masing masing individu....

7. langkah selanjutnya yaitu menambahkan kode atau script membuat garis. copy paste tepat di bawah "var context = canvas.getContext('2d');" saja script dibawah ini :

context.beginPath();

        context.moveTo(40, 190);

        context.lineTo(57, 20);

        context.lineWidth = 3;

        context.strokeStyle = 'black';

        context.lineCap = 'round';

        context.stroke();

       

        context.beginPath();

        context.moveTo(530, 20);

        context.lineTo(57, 20);

        context.lineWidth = 3;

        context.strokeStyle = 'black';

        context.lineCap = 'round';

        context.stroke();

       

        context.beginPath();

        context.moveTo(575, 160);

        context.lineTo(560, 160);

        context.lineWidth = 3;

        context.strokeStyle = 'black';

        context.lineCap = 'round';

        context.stroke();

       

        context.beginPath();

        context.moveTo(560, 160);

        context.lineTo(560, 355);

        context.lineWidth = 3;

        context.strokeStyle = 'black';

        context.lineCap = 'round';

        context.stroke();

8. untuk belajar cara memperhitungkan jarak dan menghubungkan garis - garis tersebut, anda dapat belajar di Cara membuat gambar dengan canvas di notpat ++.

9. untuk lebih lengkapnya, silahkan download script berbentuk .RAR di link dibawah ini..

LINK SCRIPT BERBENTUK .RAR

Size 1.08 KB

Link Download

Ket :

setelah anda mendownloadnya silahkan edit sesuai keinginan. okey.....

Sekian dulu artikel saya tentang Panduan pemula membuat gambar rumah di notpad ++, jangan lupa untuk mengikuti perkembangan blog saya yah...

semoga bermanfaat amiin....