Draw area chart with d3-shape on canvas?
<p>I'm trying to create an area chart on canvas using d3-shape library. Below is the code:</p>

<pre><code>const area = d3_shape.area()
  .x(function(d) { return x(d.date); })
  .y(function(d) { return y(d.price); })
  .y0(height)
  .context(context);

context.strokeStyle = '#9DBBEB';
context.beginPath();
area(data);
context.fillStyle = '#8ED6FF';
context.fill();
context.lineWidth = 1.5;
context.stroke();
</code></pre>

<p>What am I doing wrong here?</p>

<p><a href="https://github.com/d3/d3-shape" rel="nofollow">https://github.com/d3/d3-shape</a></p>

<p><a href="https://bl.ocks.org/mbostock/1550e57e12e73b86ad9e" rel="nofollow">https://bl.ocks.org/mbostock/1550e57e12e73b86ad9e</a></p>