<aside> 📘
Updated 2026-10-07 against console build 61e51287 (dev and prod). Replaces the 2024 version of this page: the engine has gained four event types, data now comes from the dashboard's dataframe rather than /aggregate/totals, and conditions can read the dashboard's selected facet and measurement.
</aside>
Dynamic Infographics overlay live data on an SVG image inside a dashboard panel. Each infographic is an SVG plus an Infographic Config: a list of CSS selectors, each with rules that style the element, change its text, show a tooltip, add an icon or react to a click.
Magenta Video Architecture HLA in prod: components with data outlined in red
| What | Where |
|---|---|
| Config list | Workspace menu › Workspace › Infographic Configs, i.e. https://console.<env>.humansnotrobots.com/settings/ws/<tenant>/infographic-configs |
| Console hosts | Dev console.dev.humansnotrobots.com · Prod console.prod-shared-eu-west-1.humansnotrobots.com |
| SVG files | Served from https://static.<env>.humansnotrobots.com/<tenant>/images/<file>.svg. Upload either to the static S3 bucket under <tenant>/images/, or by drag and drop on the config page when allowUpload is true. |
| Dashboard panel | Panel "type": "infographic" with "params": { "infographicConfigId": "<tenant>:<name>" } |
Infographic Configs list (dev, Bubo CDN)
viewBox defined on the root svg, with matching width and heightxmlns="<http://www.w3.org/2000/svg>" on the root svga with an href starting #)id. For text you want to replace, put the variable part in its own tspan and target #<id> > tspan, otherwise the static label is overwritten too.Open a config, click Edit, change the JSON, click Save.
Config editor
{
"id": "<tenant>:<name>",
"owner": "<tenant>",
"name": "<name>",
"title": "Shown in the config list",
"svgUrl": "/images/<file>.svg",
"allowUpload": true,
"templates": { "styles": [] },
"elements": [
{
"selector": "#SomeId > tspan",
"rules": [
{ "conditions": { "any": [] }, "event": { "type": "text", "params": { "literal": "–" } } }
]
}
]
}
svgUrl is the path after the <tenant>/ prefix.version and lastModifiedAt are set by the server.priority on a rule, for example, fails with "is not allowed".