title: JavaScript - One var 3 shapes
body: <p>I'm learning javascript right now so I'm still new at this. I have an image I drew in an HTML canvas. They are the same size but to reduce the code i was wondering if it's possible to turn one in a var and just adjust the position of the second one?</p>
  
  <p>heres my code:</p>
  
  <pre><code>                // Cloud 1
                  ctx.beginPath();
                  ctx.fillStyle = "#fff";
                  ctx.ellipse(320, 170, 38, 25, 0 * Math.PI/180, 0, 2 * Math.PI);
                  ctx.ellipse(340, 156, 32, 35, 0 * Math.PI/180, 0, 2 * Math.PI);
                  ctx.ellipse(368, 174, 32, 26, 0 * Math.PI/180, 0, 2 * Math.PI);
                  ctx.ellipse(390, 174, 32, 26, 0 * Math.PI/180, 0, 2 * Math.PI);
                  ctx.ellipse(392, 173, 30, 26, 0 * Math.PI/180, 0, 2 * Math.PI);
                  ctx.fill();
  
                  // Cloud 2
                  ctx.beginPath();
                  ctx.fillStyle = "#fff";
                  ctx.ellipse(720, 100, 38, 25, 0 * Math.PI/180, 0, 2 * Math.PI);
                  ctx.ellipse(740, 86, 32, 35, 0 * Math.PI/180, 0, 2 * Math.PI);
                  ctx.ellipse(768, 104, 32, 26, 0 * Math.PI/180, 0, 2 * Math.PI);
                  ctx.ellipse(790, 104, 32, 26, 0 * Math.PI/180, 0, 2 * Math.PI);
                  ctx.ellipse(792, 103, 30, 26, 0 * Math.PI/180, 0, 2 * Math.PI);
                  ctx.fill();
  </code></pre>