svg-visuals

Generate inline SVG charts via DAX measures with ImageUrl data category in Power BI reports.

887|131|Updated Jan 15, 2026
One-click install
npx skills add https://github.com/data-goblin/power-bi-agentic-development --skill svg-visuals
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: svg-visuals
Source: https://github.com/data-goblin/power-bi-agentic-development/tree/main/plugins/custom-visuals/skills/svg-visuals
Command: npx skills add https://github.com/data-goblin/power-bi-agentic-development --skill svg-visuals

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Power BI's native visuals lack lightweight inline micro-charts like sparklines, data bars, and status indicators inside tables, matrices, and cards. This Skill teaches AI agents to build these graphics as DAX measures that return SVG markup, rendered as images without custom visual registration.

Core Features & Use Cases

  • SVG DAX Measure Patterns: Provides ready-to-adapt patterns for sparklines, bullet charts, dumbbell charts, progress bars, status pills, gauges, boxplots, and IBCS bars, all following a strict VAR-based structure with axis normalization and HASONEVALUE guards.
  • PBIR Integration: Guides creation of extension measures in reportExtensions.json with the ImageUrl data category and binding to table, matrix, image, card, and slicer visuals via the pbir CLI.
  • UDF Library Guidance: Directs users to existing libraries (PowerofBI.IBCS, DaxLib.SVG, MacGuyver Toolbox) before writing custom DAX, plus accessibility and performance rules including the 32K per-cell string limit.
  • Use Case: A report developer asks an agent to add a 12-month sales sparkline column to a product table; the agent queries the model, previews a static SVG, writes the CONCATENATEX-based measure, binds it, and validates the report.

Quick Start

Ask the agent to create a DAX sparkline SVG measure for the sales table and bind it to a column in the report's product table visual.

Frequently Asked Questions about svg-visuals

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create an SVG sparkline in Power BI with DAX?

Write a DAX measure that returns a string prefixed with data:image/svg+xml;utf8, containing SVG markup built with CONCATENATEX over time-series points. Set the measure's dataCategory to ImageUrl and bind it to a table or matrix column.

Which Power BI visuals support SVG measures?

Table, matrix, image, the new card visual (cardVisual), and the new slicer support SVG measures via the ImageUrl data category. The classic card visual does not support SVG and renders it as text or blank.

Should I use DaxLib.SVG or write custom SVG DAX measures?

Check UDF libraries first: DaxLib.SVG covers sparklines, boxplots, heatmaps, and progress bars, while PowerofBI.IBCS handles IBCS-compliant business charts. Write custom DAX only when no library function covers the required visualization.

Why does my SVG measure render blank in Power BI?

Common causes include using %23 URL encoding instead of hex colors with #, missing HASONEVALUE guards on total rows, exceeding the 32K character limit per cell, or using sourceType imageUrl instead of imageData in image visuals.

When should I use Deneb instead of SVG measures?

Use Deneb for complex interactive visualizations requiring cross-filtering, tooltips, or hover states, and for layouts that must adapt to container width. SVG measures are static images with no interactivity and a 32K string ceiling.