A full treatment of SVG is beyond the scope of this book. However, every SVG graphic must start with the text defined in the __header variable. In addition, every SVG graphic must end with the text defined in the __footer variable. SVG, like other XML, consists of a series of code tags that begin with a tag such as <tag> that must be matched with a corresponding ending tag, </tag>.
The __shapeText variable defines the actual heart graphic. Within the __shapeText string, the first element is the g tag. This is the grouping element within the SVG specification. This means that all the elements within the g tag should be treated as a group. The next tag is a circle. These circle tags define the top of the heart. The next tag, path, draws a triangle that starts at the bottom of the circles and forms the bottom point of the heart. Then, we end the g tag.
Now, we can simply concatenate our __header, __shapeText, and __footer together to return the full SVG image. However, since SVG code is just text, we must tell Power BI to treat the text that's returned by the Heart measure as a web graphic. This is the reason we need to set the Data category for the measure to an Image Url.