In this hint we explain how to combine a Pajek's network picture
in SVG with a bitmap background picture.
Suppose that we would like to overlay the following bitmap picture,
stored in the file Pajek.jpg
with a SVG picture, stored in the file acyclic.svg
First we determine the size of the bitmap picture - by importing it
into some viewer
The size of Pajek.jpg is 1056 x 900.
We also determine the size of the SVG picture - by opening it in a
text editor and looking at the parameters in the tag <svg>.
The size of acyclic.svg is 493 x 533.
If the SVG picture was not exported from Pajek
with the transparent background setting in the Draw/Export/Options
we have to comment out (or simply delete) the background rectangle (7th line)
Then we combine both pictures using the following 'template'
We set the size of the viewBox and the bitmap image to the half
of its original size, thus providing detailed background picture also after
(the first) zooming.
Using the transformations scale and translate
we can control the size and position of SVG picture on the
We save the combined picture as PajekBG.svg.
To include it into a HTML page we use the 'template'