Inset

WLJS

Execution environment

Supports dynamics

wljs-graphics-d3

Package

Inset[_Graphics | _Graphics3D | _Image | _EditorView | _, pos_List, opts___]

Inset[_Graphics | _Graphics3D | _Image | _EditorView | _, pos_List, origin_List, size_List, opts___]

a graphics object, that allows to put another Graphics, Image, EditorView, CellView or anything else for which WLJS execution environment makes sense into the canvas.

• pos has to be a 2D vector, that specifies the position of the inset in the local coordination system
• origin is optional and specifies the coordinates of the pin point in the local coordinate system of inset object (if it is Image, then this has to be in pixels units) (absolute coordination system). By the default it takes the center of calculated size
• size is displayable size in the local coordinate system of parent graphics object (with respect to Inset).

warning

By the default if only pos parameters is provided, it tries to set the rest based on the DOM size of the inner element. Sometimes if you use CellView or EditorView, which relies on asynchronous evaluation, it becomes tricky to predict the size and it might show nothing.

Please for this case provide origin and size manually

Options

ViewMatrix

In dev

If set to None, then no linear transformation will be applied to canvas, i.e. origin, size, pos will be ignored. Object will be displayed at it is.

Examples

inset = Graphics[{
  LightRed,
  Disk[{0,0},0.1],
  Black, Directive[FontSize->16], Text["Test", {-1/16,-1/30}]
}, PlotRange->{{-1,1}, {-1,1}}];

Plot[x, {x,0,10}, Epilog->{Inset[inset]}]

or put EditorView

Dynamics

The second arguments pos that specifies the position of an inset does support dynamic updates, i.e. try

inset = Graphics[{
  LightRed,
  Disk[{-1-0.13,0.9},0.1],
  Black, Directive[FontSize->16], Text["Test", {-1/16 - 1 - 0.13,-1/30 + 0.9}]
}, PlotRange->{{-1,1}, {-1,1}}];

pts = {0,0};

Plot[x, {x,0,10}, Epilog->{Inset[inset, pts // Offload]}]

and then

Do[pts = {i,i}; Pause[0.1];, {i, 0, 10, 0.5}]