SVG support

[siiky]

Just searched the issues/PRs and nothing came up. Also searched the repo and the only hit seems to be something to do with fonts. Weird...

Are there plans to support SVG images? Or am I perhaps missing something?

I'm using Lagrange v1.13.7 installed with Nix, and I get this:

So apparently Lagrange knows it's an image, just can't load it. Here's an example file, genereated with GraphViz:

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
 "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Generated by graphviz version 2.43.0 (0)
 -->
<!-- Title: folder1 Pages: 1 -->
<svg width="465pt" height="91pt"
 viewBox="0.00 0.00 465.38 91.19" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="graph0" class="graph" transform="scale(1 1) rotate(0) translate(4 87.19)">
<title>folder1</title>
<polygon fill="white" stroke="transparent" points="-4,4 -4,-87.19 461.38,-87.19 461.38,4 -4,4"/>
<!-- input -->
<g id="node1" class="node">
<title>input</title>
<ellipse fill="none" stroke="black" cx="35.1" cy="-41.6" rx="35.19" ry="35.19"/>
<text text-anchor="middle" x="35.1" y="-37.9" font-family="Times,serif" font-size="14.00">input</text>
</g>
<!-- kons -->
<g id="node4" class="node">
<title>kons</title>
<polygon fill="none" stroke="black" points="160.19,-59.6 106.19,-59.6 106.19,-23.6 160.19,-23.6 160.19,-59.6"/>
<text text-anchor="middle" x="133.19" y="-37.9" font-family="Times,serif" font-size="14.00">kons</text>
</g>
<!-- input&#45;&gt;kons -->
<g id="edge1" class="edge">
<title>input&#45;&gt;kons</title>
<path fill="none" stroke="black" d="M70.25,-41.6C78.52,-41.6 87.39,-41.6 95.76,-41.6"/>
<polygon fill="black" stroke="black" points="96.01,-45.1 106.01,-41.6 96.01,-38.1 96.01,-45.1"/>
</g>
<!-- output -->
<g id="node2" class="node">
<title>output</title>
<ellipse fill="none" stroke="black" cx="415.79" cy="-41.6" rx="41.69" ry="41.69"/>
<text text-anchor="middle" x="415.79" y="-37.9" font-family="Times,serif" font-size="14.00">output</text>
</g>
<!-- acc -->
<g id="node3" class="node">
<title>acc</title>
<ellipse fill="none" stroke="black" cx="222.19" cy="-41.6" rx="26" ry="26"/>
<text text-anchor="middle" x="222.19" y="-37.9" font-family="Times,serif" font-size="14.00">acc</text>
</g>
<!-- acc&#45;&gt;kons -->
<g id="edge2" class="edge">
<title>acc&#45;&gt;kons</title>
<path fill="none" stroke="black" d="M196.89,-47.72C188.7,-48.29 179.38,-48.47 170.47,-48.26"/>
<polygon fill="black" stroke="black" points="170.43,-44.76 160.3,-47.84 170.14,-51.75 170.43,-44.76"/>
</g>
<!-- peek -->
<g id="node5" class="node">
<title>peek</title>
<polygon fill="none" stroke="black" points="338.19,-59.6 284.19,-59.6 284.19,-23.6 338.19,-23.6 338.19,-59.6"/>
<text text-anchor="middle" x="311.19" y="-37.9" font-family="Times,serif" font-size="14.00">peek</text>
</g>
<!-- acc&#45;&gt;peek -->
<g id="edge4" class="edge">
<title>acc&#45;&gt;peek</title>
<path fill="none" stroke="black" d="M247.89,-35.44C255.98,-34.9 265.14,-34.73 273.9,-34.93"/>
<polygon fill="black" stroke="black" points="273.77,-38.43 283.91,-35.34 274.06,-31.43 273.77,-38.43"/>
</g>
<!-- kons&#45;&gt;acc -->
<g id="edge3" class="edge">
<title>kons&#45;&gt;acc</title>
<path fill="none" stroke="black" d="M160.3,-35.35C168.64,-34.84 178.01,-34.72 186.85,-34.98"/>
<polygon fill="black" stroke="black" points="186.73,-38.48 196.89,-35.47 187.07,-31.49 186.73,-38.48"/>
</g>
<!-- peek&#45;&gt;output -->
<g id="edge6" class="edge">
<title>peek&#45;&gt;output</title>
<path fill="none" stroke="black" d="M338.34,-41.6C346.11,-41.6 354.9,-41.6 363.68,-41.6"/>
<polygon fill="black" stroke="black" points="363.92,-45.1 373.92,-41.6 363.92,-38.1 363.92,-45.1"/>
</g>
<!-- peek&#45;&gt;acc -->
<g id="edge5" class="edge">
<title>peek&#45;&gt;acc</title>
<path fill="none" stroke="black" d="M283.91,-47.85C275.78,-48.34 266.69,-48.47 258.07,-48.23"/>
<polygon fill="black" stroke="black" points="258.04,-44.72 247.89,-47.75 257.71,-51.71 258.04,-44.72"/>
</g>
</g>
</svg>

Thanks for the awesome browser!

[skyjake]

Lagrange checks the MIME type and sees it starts with image/, so it is assumed to be some sort of image.

SVG is a bit tricky to support because it requires additional dependencies. As the app is cross-platform, this would mean finding and setting up a suitable library/API for Windows, macOS/iOS, Linux, *BSD/other Unix, and Android – a sizable time investment.

I've been considering a different approach using the MIME hooks content filtering mechanism. The idea would be to allow configuring external tools that dynamically convert content to formats displayable by the app, handling the resizing and caching aspects as needed by the UI. This way, any command-line SVG-to-PNG tool could be used to display SVG images seamlessly in the app. On mobile platforms, it could be reasonable to implement this via the native APIs as well, via a build-in hook.

[CyberTailor]

Can't SDL2 display SVG?

[skyjake]

@CyberTailor No, SVG is not supported afaik. There might be SDL-compatible 3rd party libraries for rendering SVG, though.