Function ImageStim

ImageStim(
    props: {
        image?: ImageBitmap | ImageData;
        draw?(ctx: CanvasRenderingContext2D): void;
    },
): { node: HTMLCanvasElement }

Image stimulus component for displaying images or custom canvas drawings

Parameters

props: { image?: ImageBitmap | ImageData; draw?(ctx: CanvasRenderingContext2D): void }

Returns { node: HTMLCanvasElement }

Example

const [bitmap] = await app.load(['https://picsum.photos/200'], (blob) =>
  window.createImageBitmap(blob),
);
using imageScene = app.scene(ImageStim, {
  defaultProps: {
    image: bitmap,
    draw: (ctx) => {
      ctx.fillStyle = 'red';
      ctx.fillRect(10, 10, 100, 100);
      ctx.fillStyle = 'blue';
      ctx.beginPath();
      ctx.arc(60, 60, 30, 0, 2 * Math.PI);
      ctx.fill();
    },
  },
});
await imageScene.show();

Function ImageStim

Parameters

Returns { node: HTMLCanvasElement }

Example

Settings