title: Draw a parabola with 3 given points canvas
body: <p>I need to draw a perfect curve / parabola in an html5 canvas. The 3 {x;y} coordinates of the points are given. I tried with a bezierCurveTo or a quadraticCurveTo, but the curve won't go in the middle point.</p>
  <p>The result I want ( the blue doted curve, and the blue one ) : <a href="https://i.stack.imgur.com/gAxE5.png" rel="nofollow noreferrer">Wanted result</a></p>
  <p>The result I have : <a href="https://i.stack.imgur.com/7fkY4.png" rel="nofollow noreferrer">Current result</a></p>
  <p>Code :</p>
  <pre><code>      ctx.strokeStyle = '#00478a';
        ctx.lineWidth = 1.5;
  
        ctx.beginPath();
        ctx.moveTo(x1AtRatio, 30);
        ctx.quadraticCurveTo(criticalSectionAtRatio, 100, x2AtRatio, 30);
  
        ctx.stroke();
  </code></pre>
  <p>Where x1AtRatio - x2AtRatio - criticalSectionAtRatio are the given x by user input and 30 - 100 - 30 are the y</p>