Sapins

<button onclick="myForest()">Forêt</button><br/><br/>

<canvas id="foret" width="400" height="600" style="border:1px solid #c0c0c0;"></canvas>

<script>

function myForest() {

var canvas = document.getElementById("foret");

var ctx = canvas.getContext("2d");

for (var i = 0; i < 30; i++) {

var randomString0 = new Array ();

    randomString0[0] = 0;

    randomString0[1] = 200;

    randomString0[2] = 400;

var h0 = Math.floor(3*Math.random());

var randomString1 = new Array ();

    randomString1[0] = 50;

    randomString1[1] = 150;

    randomString1[2] = 250;

    randomString1[3] = 350;

var w0 = Math.floor(4*Math.random());

var x0 = randomString1[w0];

var y0 = randomString0[h0]+10;

var r0 = Math.floor(100*Math.random());

var g0 = Math.floor(256*Math.random());

var b0 = Math.floor(100*Math.random());

var p = new Path2D("m"+x0+","+y0+"c1,0 -35,58 -35,58c0,0 24,1 24,1c0,0 -24,41 -24,41c0,0 20,1 21,1c1,0 -22,41 -22,41c0,0 25,-1 25,-1c0,0 0,34 0,34c0,0 22,2 22,2c0,0 -4,-42 -4,-42c0,0 23,2 23,2c0,0 -18,-35 -18,-35c0,0 24,0 24,-1c0,-1 -26,-40 -26,-40c0,0 25,-4 25,-4c0,0 -35,-57 -35,-57z");

ctx.fillStyle = "rgba("+r0+", "+g0+", "+b0+", 0.5)";

ctx.fill(p);

}}

</script>