title: Canvas content is not showing
body: <p>Good day,
  I have a problem with the canvas. I'm using boostrap and I'd like to show some graphics. I have this:</p>
  
  <pre><code>&lt;div id="charts" class="tab-pane fade"&gt;
    &lt;div class="container-fluid-charts onload="init();"&gt;
      &lt;div id="container1" style="width: 100%; height: 400px; margin: 0 auto;border: 1px solid black;background-color: white;"&gt;&lt;/div&gt;
        &lt;canvas id="chart1"&gt;Your browser cannot display the charts...&lt;/canvas&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The Javascript is composed like this:</p>
  
  <pre><code>function init() {
      var c = document.getElementById("chart1");
      var ctx1 = c.getContext('2d');
  
      drawChart1();
  }
  
  function drawChart1() {
      ctx1.moveTo(ctx.canvas.width / 2 , 0);
      ctx1.lineTo(0, ctx.canvas.height);
      ctx1.stroke();
  
      ctx1.beginPath();
      ctx1.arc(95,50,40,0,2*Math.PI);
      ctx1.stroke();
  
      ctx1.font = "30px Arial";
      ctx1.fillText("Hello World",10,50);
  }
  </code></pre>
  
  <p>I have no errors showing and the canvas is empty. I think it's related to the DOM... Anyone can help me please ?</p>