-1

In https://stackoverflow.com/a/44795246/3416774, the essence of the code is:

network.on("afterDrawing", function (ctx) {
    var dataURL = ctx.canvas.toDataURL();
    document.getElementById('canvasImg').src = dataURL;
});

How can it run? ctx isn't defined anywhere. In the Vis.js' documentation, the afterDrawing event has this description:

Name Properties Description
afterDrawing canvas context Fired after drawing on the canvas has been completed. Can be used to draw on top of the network.
pilchard
  • 12,414
  • 5
  • 11
  • 23
Ooker
  • 1,969
  • 4
  • 28
  • 58
  • 1
    the `afterDrawing` event provides the `ctx` to the passed callback. see the [docs](https://visjs.github.io/vis-network/docs/network/#Events) – pilchard Nov 07 '21 at 15:53
  • 1
    this is a concept called `callback functions`, once `.on` is done doing it's thing, it will return a value `ctx` which you can use in your code. – tsamridh86 Nov 07 '21 at 15:55
  • "isn't defined anywhere". Well, it is defined as parameter of the `function`. – PhiLho Nov 07 '21 at 16:05
  • And listed as a 'property' of the `afterDrawing` event in the docs (though this is confusing language). – pilchard Nov 07 '21 at 16:05
  • @pilchard ah, `ctx` is short for `canvas context`. So when the method `on()` completes, it will return the canvas context so the `function` can pick up? – Ooker Nov 07 '21 at 16:20
  • Yes, that's the gist of it. – pilchard Nov 07 '21 at 16:21

1 Answers1

0

ctx is short for canvas context. So when the method on() completes, it will return the canvas context so the function can pick up. This is a concept called callback functions.

Ooker
  • 1,969
  • 4
  • 28
  • 58