user:mate2code/bin2svg

From Wikiversity
Jump to: navigation, search
Binary matrix to SVG path
Sierpinski triangle drawn with bin2svg — The red squares form one continuous area with only one edge, so the path contains only one M.

bin2svg is a small program that takes a binary matrix and returns the corresponding SVG path of the area covered by ones.

I initially wrote it in Matlab, and that version is still displayed below. I have translated it into Python, and that version is found here.

Matrices created with this program are marked with {{Created with bin2svg}} and sorted into the hidden category Created with bin2svg.



If the function gets the binary matrix \begin{bmatrix}
0 & 0 & 0 & 1 \\
1 & 1 & 1 & 0 \\
1 & 0 & 1 & 0 \\
1 & 1 & 1 & 0
\end{bmatrix} it will create the intermediate matrix \begin{bmatrix}
0 & 0 & 0 & 1 & 2 \\
1 & 0 & 0 & 24 & 3 \\
0 & 5 & 8 & 0 & 0 \\
0 & 6 & 7 & 0 & 0 \\
4 & 0 & 0 & 3 & 0
\end{bmatrix} which shows that there are three cycles of corners:
Two on the outside of an area of ones (with clockwise numbers 1...4) and one hole (with anticlockwise numbers 5...8). (The 24 is a 2 and a 4 in the same place.)
The outside cycles give the paths M3,0 h1 v1 h-1 and M0,1 h3 v3 h-3, and the hole gives M1,2 v1 h1 v-1.
So the output of the function is M3,0h1v1h-1M0,1h3v3h-3M1,2v1h1v-1.

Bin2svg example.svg

In the following SVG code the result produces the image shown on the right:

<?xml version = "1.0" encoding = "UTF-8" ?>
<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="-.5 -.5 5 5">
    <path fill="#fff" d="m0,0h4v4H0"/> <!-- white background -->
    <path fill="#f00" d="M3,0h1v1h-1M0,1h3v3h-3M1,2v1h1v-1"/> <!-- red entries -->
    <g stroke="#000">
        <path stroke-width="4" stroke-dasharray=".05,.95" d="M0,2h5M2,0v5"/> <!-- 0.5px black lines -->
        <rect stroke-width=".1" fill="none" x="0" y="0" width="4" height="4"/> <!-- 1px black square -->
    </g>
</svg>



Derived functions for integer matrices[edit]

Binary strings created with mat2svg(Matrix,4,5,2)
Binary matrices below are created with mat2svg_dual(Matrix,4,3)
Binary strings created with mat2svg(Matrix,16,8,2)
Binary matrices below are created with mat2svg_dual(Matrix,16,2)



mat2svg[edit]

function [Code] = mat2svg(Mat,Bitlong,Gapvert,Gaphorz)
% Produces the SVG code for binary strings in an SVG graphic of a matrix of integers.
% Inputs: ( matrix, length of binary strings, size of vertical gaps, size of horizontal gaps )
 
% used functions: bin2svg, char2mat
 
Matvert = size(Mat,1) ;
Mathorz = size(Mat,2) ;
 
Bin = zeros(   Matvert + (Matvert-1)*Gapvert   ,   Mathorz*Bitlong + (Mathorz-1)*Gaphorz   ) ;
 
for m=1:Matvert
    for n=1:Mathorz
        Bin( (m-1)*(Gapvert+1)+1 , (n-1)*(Bitlong+Gaphorz)+1 : (n-1)*(Bitlong+Gaphorz)+Bitlong ) = char2mat( dec2bin(Mat(m,n),Bitlong) ) ; 
    end
end
 
Code = bin2svg( Bin ) ;
 
end


mat2svg_dual[edit]

function [Code] = mat2svg_dual(Mat,Bitlong,Gap)
% Produces the SVG code for binary dual matrix in an SVG graphic of a matrix of integers.
% Inputs: ( matrix, length of binary strings, size of gap between matrices )
 
% used functions: bin2svg, char2mat
 
Matvert = size(Mat,1) ;
Mathorz = size(Mat,2) ;
 
Binmat = zeros(   Matvert   ,   Mathorz*Bitlong + (Bitlong-1)*Gap   ) ;
 
for m=1:Matvert
    for n=1:Mathorz
        Binvect = char2mat( dec2bin(Mat(m,n),Bitlong) ) ;
        for k=1:Bitlong
            Binmat( m , (Mathorz+Gap)*(k-1)+n ) = Binvect(k) ;
        end
    end
end
 
Code = bin2svg( Binmat ) ;
 
end