Course staff: Regenerate your assessment instance to pick up changes to the assessment or to get a fresh set of questions.

C4.32. Element pl-figure: Display a statically or dynamically generated image

The examples below showcase different features of pl-figure. The goal of this element is to display statically and dynamically generated images.

Part 1

Here is an example of of a static figure. By default, pl-figure will read static files from the clientFilesQuestion directory or from clientFilesCourse directory if overridden using the directory attribute. Depending on the display size of the window, the size of the displayed figure will automatically adjust to fit within the window.

Part 2

Here is an example of a fixed width figure. The width of the displayed figure can be set using the width attribute; the size of the figure will automatically shrink if the the specified width is too big for the display window.

Part 3

Here is an example of a dynamic figure. The contents of a dynamic image can be generated using the file() function inside server.py when the attribute type="dynamic" is set in the element tag.

Part 4

Here is an example of inline figures.

Select Slider set to true instead of Slider set to false from below.

(a)

Select this: Slider set to true

(b)

Not this:

Use display="inline" to embed a figure inline with the rest of the elements, like texts.

Additional attempts available with new variants

Collection 4

Assessment overview

Total points:	0/360
Score:	0%

Question C4.32

Value:	2
All variants: Open (current)
Total points:	— /10
Auto-graded question

Previous question Next question

Personal Notes

No attached notes

Staff information

Student details

Dev User

dev@example.com

Question

QID:

element/figure

Title:

Element pl-figure: Display a statically or dynamically generated image

Variant

Started at:

2026-08-04 16:37:51 (CDT)

Duration:

Show/Hide answer

{
  "booleans": {
    "key": "a",
    "html": "Select this: <pl-figure file-name=\"true.png\" display=\"inline\" alt=\"Slider set to true\"></pl-figure>",
    "score": 1,
    "feedback": null
  }
}

Assessment instance

Assessment:

gallery/elements