Generating heraldic shields in svg from xml formatted blazons

E. Urban Engström


Vaktbergsvägen 10 B
SE-14941 Nynäshamn

+46 8 64 222 17


For a long time there has been a need for searching databases of structured graphical content for sub content, e.g. structural elements of heraldic shields. Today this is done by a tedious searching through indexes of keywords in more or less easily obtainable collections of armoires. This means a lot of consulting of references libraries and a huge need for a long time experience in order to find the right information, if at all available.

This paper suggest an alternative approach utilizing the fact that arms are defined by there blazons, a very strict way of describing the composition of the elements on the shield. The structure of the blazon has a kind of tree like information structure much like the DOM. From realising this, there is just a matter of converting the information structure of the blazons into XML structure, this part of the problem is under development in parallel studies (1,2).

The above mentioned approach would solve the first part of the problem, i.e. making the sub elements of arms searchable. Typically answering to questions like: "which arms has a rampant golden lion on blue background in the fourth quadrant". The desirable answer to that question would not only be a mere list of blazons for various arms, but really one would like to be able to generate those arms from there blazons on the fly.

The focus of this paper is thus on converting xml structured blazons to representative renderings of heraldic shields in svg format. Following heraldic tradition, the graphical manipulation of the resulting shields will be dealt with in terms of tincture, divisions and objects. Initially the focus is on tincture, divisions and simple objects. Further on more complex objects like the various heraldic beasts will be added, but this is really a minor task (though tedious) - as it mainly consists of building up a library of svg clip-arts.

The present work focus on the problem of building up arms in svg format from blazons in xml format. This is done by xsl transformation of the blazons, this means that from a database of heraldic blazons stored in xml format one would be able to describe its content as generated text (2) as well as by rendered graphics. At the same time all information about any field in any arm is searchable via DOM.

The illustration below shows two fairly simple examples. Let us first look at the arm of the Canton Zürich which is identical to the arms of the city of Zürich and dates back to 1389. The blazon would be "divided per bend silver and blue", which simply means that the shield is divided from the top left corner to the bottom right corner and that the upper field is colored silver and the bottom field blue. For a more complex shield each field could there after contain objects and or be further divided.

Next, we take a look at Adhémar de Monteil, who was involved in the first crusade and died in Antioch 1098, he got his blazon back in 1096 as "d'or, á trois bandes d'azur" (3). Here his arm illustrates a common problem in old armories, they are blazoned on the local language and the source could be very hard to get hold of. Fortunately the rules of blazons applies in very similar ways in all languages, so here translating the blazons to xml make sense.

Part of the xml data, using the DTD devolped (1), would look like this:

    <blazon lang="se">på guld tre blå band </blazon>
    <blazon lang="en">or, three bends azur</blazon>
    <blazon lang="fr">d'or, á trois bandes d'azur</blazon>
      <field color="or">
         <object color="azure" number="3">

The proposed method (2) would then regenerate the xml data back to "or, 3 bend(s) azur".

The strategy in developing the xsl transformation is really to follow the structure of the tree structure in the balzon, i.e. building up the shield field for field. The paper will deal with the more specific strategies for generating the svg data effectively.

SVG blazon svg source

Zürich, 1389
divided per bend silver and blue

<svg viewBox= "00 10001000">
  <polygon points= "0,01000, 1000 0, 1000" 
  <polygon points= "0,01000,1000 1000,0"

Adhémar de Monteil, 1096 (3)
d'or, á trois bandes d'azur

on or three bends azur

på guld tre blå band

<svg  viewBox="0 0 600 600" . . .  >
    <rect id="Bend" x="0" y="0"  width="100"
     height= "600" style= "fill:rgb(0,0,255)"/>
  <rect x="0" y="0" width="600" height="600"
  <use x="50" y="0" xlink:href="#Bend"/>
  <use x="250" y="0" xlink:href="#Bend"/>  
  <use x="450" y= "0" xlink:href= "#Bend"/>

Babbington (4)
gules, three bezants

<svg  viewBox="0 0 1000 1000"  . . .   >
    <circle id="Bezant" cx="500" cy="500" r="150"
  <rect x="0" y="0" width="1000" height="1000"
   <use x="0" y="200" xlink:href="#Bezant"/>
   <use x="-200" y="-150" xlink:href="#Bezant"/>
   <use x="200" y="-150" xlink:href="#Bezant"/>

1. E.U. Engström, "BlasonML a DTD for representing heraldic information in xml format", to be published.
2. E.U. Engström, "Regenerating blazons from xml-data", to be published.
3. Ch. Gavard, (ed.), "Galeries Historique de Versailles, salle des Croisades", Paris, bureau central des "Galeries historiques de Versailles", 1837.
4. B. Burke, "The General Armory of England, Scotland, Ireland and Wales", London, Harrison, 1884.

Information about the progress of this project as well as preview of papers to be published will be available at the development site of ouroborus.