•canvas — Drawing with JavaScript

•canvas source returns a drawing function made from source, the source of a JavaScript function such as (ctx, data, options) => …. options draw data gives a record of the source, the options and the data, which notebooks and the playground display as a canvas. Displaying it calls the JavaScript function with the canvas’s 2D context, the data and the options. Without options, it gets an empty object. The values cross into JavaScript as •js describes.

Where there is no canvas, as in the REPL, the record shows as one line of text: canvas: N frames when the options give fps and the data is a vector of N frames, and canvas otherwise.

BPL computes the data, and the JavaScript decides how to show it, including the canvas’s size, which it sets through ctx.canvas:

bars←•canvas "(ctx, d, o) => { ctx.canvas.width = o.width; d.data.forEach((v, i) => ctx.fillRect(20 * i, 100 - v, 15, v)); }"
chart←["width":80] bars 30 80 55 100
chart.options.width   ⍝ 80

Errors: DOMAIN when the options or data hold a function.