<?xml version="1.0"?>
<rss version="2.0">
	<channel>
		<title>Using vector images on allegro</title>
		<link>http://www.allegro.cc/forums/view/617566</link>
		<description>Allegro.cc Forum Thread</description>
		<webMaster>matthew@allegro.cc (Matthew Leverton)</webMaster>
		<lastBuildDate>Wed, 26 Sep 2018 22:42:06 +0000</lastBuildDate>
	</channel>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>Hi guys! I would like to know how to use vector images in allegro, with a library for example and I think the best format is &quot;.svg&quot;. Thank you!;D
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (Gustavo)</author>
		<pubDate>Sun, 23 Sep 2018 01:31:11 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>Allegro doesn&#39;t support vector images. You&#39;ll have to render them to .png or another supported file type first. That means no run-time resizing. Otherwise, Aaron Bolyard has some code to work with SVG files and Allegro I believe.
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (Edgar Reynaldo)</author>
		<pubDate>Sun, 23 Sep 2018 01:50:45 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>But does not have a C ++ library that allows you to expand files supported by allegro?
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (Gustavo)</author>
		<pubDate>Sun, 23 Sep 2018 01:56:24 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>SVG is a very complex image format, because of the way it deals with curves. There may be libraries out there that can convert SVG to raw RGBA data if you look. Allegro can use raw RGBA data when used with the locking mechanism for bitmaps.
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (Edgar Reynaldo)</author>
		<pubDate>Sun, 23 Sep 2018 02:07:50 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>Okay, it does not have to be SVG, I just need a way when the player to play my game he can resize the screen without the graphics losing image quality, as with vector images, and I think the only way to do it this is using a library.
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (Gustavo)</author>
		<pubDate>Sun, 23 Sep 2018 02:13:50 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>Well, again, it depends on what you need.</p><p>If you truly need 100% resolution independence, going from a 90&#39;s phone, to an 8K TV, you&#39;ll need a vector format. </p><p>The easiest way, would be to simply use another library or (command line) tool to convert your SVG artwork, to whatever size (or range of sizes) you want. Either at first game startup (and save the cached versions), or (simpler) every time you start the game.</p><p>But 99.9% of cases don&#39;t actually need absolute resolution independence. 99.9% of games have a <i>subset</i> of target platforms. You&#39;re not running on an Nintendo NES from the 80&#39;s with a CRT TV. &quot;Duh&quot;, you may think, but I&#39;m striking a point. Your target market is less than the total set of &quot;all computers ever.&quot; So your goal should be &quot;What IS my subset of target platforms?&quot; (The <a href="https://store.steampowered.com/hwsurvey/Steam-Hardware-Software-Survey-Welcome-to-Steam?platform=pc"> Steam hardware survey</a> is a great starting point.)</p><p>Now that we&#39;ve established that, it would be very helpful to have some typical cases / examples / previous games that can show us what you want to achieve. For example, you could render those SVG&#39;s to &quot;mipmaps.&quot; You take the same image, render it at multiple sizes (256x256, 128x128, 64x64, ...) and then you either draw the smallest one that&#39;s bigger than your end size. So if you draw 200x200, you&#39;d use 256x256 and shrink down. Or, if your particular artwork looks better this way, you&#39;d use the 128x128 and scale UP.</p><p>You can also use many different scaling algorithms. The simplest being pixel-scaling (aka point sampling and &quot;nearest neighbor&quot;). Basically you just re-sample your source bitmap pixel for every relevant destination pixel with NO BLENDING. Bilinear blending can work fine. And since you&#39;re using mipmaps, TRILINEAR is also an option.</p><p><span class="remote-thumbnail"><span class="json">{"name":"6-18.gif","src":"\/\/djungxnpq2nug.cloudfront.net\/image\/cache\/1\/1\/11a8fe60b461e93758e83a86d568f213.gif","w":771,"h":371,"tn":"\/\/djungxnpq2nug.cloudfront.net\/image\/cache\/1\/1\/11a8fe60b461e93758e83a86d568f213"}</span><img src="http://www.allegro.cc//djungxnpq2nug.cloudfront.net/image/cache/1/1/11a8fe60b461e93758e83a86d568f213-240.jpg" alt="6-18.gif" width="240" height="115" /></span><br />We can give more detailed / applicable tips with some examples.
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (Chris Katko)</author>
		<pubDate>Sun, 23 Sep 2018 03:59:18 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>Most performant option is to generate a mesh from the SVG offline and use that. This is easy enough using GLU or some other tessellator. Outside of absurdly high zoom levels the curves will remain high quality and you can use MSAA to smooth everything.</p><p>You&#39;ll just have high poly counts but since you don&#39;t (hopefully) have textures you can batch things like crazy. MSAA is going to be the biggest performance bottleneck. Sorting by depth and using the depth buffer can help with fill rate issues.</p><p>Alternatively at runtime could you render the mesh to texture of the desired size (e.g., computed based on max zoom or screen resolution). You can even generate atlases dynamically to greatly improve performance (like how RuneScape does it) but that gets insane fast.
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (Erin Maus)</author>
		<pubDate>Sun, 23 Sep 2018 04:39:45 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>If performance isn&#39;t a concern, you can use Inkscape from the command line to produce your png&#39;s on the fly.</p><p><a href="https://inkscape.org/en/doc/inkscape-man.html">https://inkscape.org/en/doc/inkscape-man.html</a></p><pre>inkscape -f scalable.svg -w 1024 -h 768 -e scaled.png</pre><p>
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (Edgar Reynaldo)</author>
		<pubDate>Sun, 23 Sep 2018 20:09:48 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>An Allegro library that reads in SVGs and translates them to draw instructions is entirely possible, but would probably be rather complex and wouldn&#39;t be able to fully realise the SVG specification. As Edgar said, it&#39;s a big spec.</p><p>If, however, you just wanted to draw solid (or <i>possibly</i> gradient-filled) shapes and lines accurately (which is what I&#39;d imagine you&#39;d be using it for):</p><ul><li><p>Get an XML parsing library</p></li><li><p>Read in an SVG&#39;s points and colours. The latter wouldn&#39;t be easy - because you&#39;ll have to extract them from the CSS - but if the styles aren&#39;t too wacky this could probably be done with a regex or two.</p></li><li><p>At render time, use <span class="source-code"><a href="http://www.allegro.cc/manual/al_calculate_spline"><span class="a">al_calculate_spline</span></a></span> (and other assorted trickery) to produce a joined-up list of vertices for the given draw scale for each path segment in the graphic</p></li><li><p>Draw those vertices</p></li></ul><p>

Come to think of it, this may all become a lot easier if you&#39;re using one of Allegro&#39;s <a href="https://liballeg.org/bindings.html">bindings</a>. For instance, <a href="https://github.com/JoshVarga/svgparser">here&#39;s a ready-made SVG parser</a> for Go.
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (dthompson)</author>
		<pubDate>Mon, 24 Sep 2018 02:57:05 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>Hmm I wrote an SVG parser/converter once with aid of Flex and Bison for a company I worked for. ( so I don&#39;t have or own any code)<br />It might be a nice idea to write an SVG import for allegro.. but that will take quite some time.. It is not that simple.</p><p>Supporting vectorgraphics in allegro should be possible I think..
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (Ariesnl)</author>
		<pubDate>Mon, 24 Sep 2018 11:34:58 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p><a href="https://github.com/memononen/nanosvg">https://github.com/memononen/nanosvg</a></p><p>Or use this svg parser as the base of your work ☺️
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (beoran)</author>
		<pubDate>Wed, 26 Sep 2018 18:16:02 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>I might have to use that NanoSVG parser in my next SpeedHack...</p><p><a href="https://unicode.org/emoji/charts/full-emoji-list.html#1f605">😅&amp;#x1f605;</a>
</p><pre>
☺️☺️☺️☺️☺️☺️☺️☺️☺️☺️☺️
☺️         ☺️
☺️  ☺️   ☺️  ☺️
☺️    ☺️    ☺️
☺️ ☺️     ☺️ ☺️
☺️ ☺️☺️☺️☺️☺️☺️☺️ ☺️
☺️         ☺️
☺️☺️☺️☺️☺️☺️☺️☺️☺️☺️☺️
</pre><p>
🐒
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (Edgar Reynaldo)</author>
		<pubDate>Wed, 26 Sep 2018 19:45:56 +0000</pubDate>
	</item>
	<item>
		<description><![CDATA[<div class="mockup v2"><p>
There is also <a href="http://www.antigrain.com/index.html">http://www.antigrain.com/index.html</a> which includes an example SVG viewer.</p><p>Note: <a href="https://www.labri.fr/perso/nrougier/news/2013/11/26/MaximShemanarev.html">https://www.labri.fr/perso/nrougier/news/2013/11/26/MaximShemanarev.html</a>
</p></div>]]>
		</description>
		<author>no-reply@allegro.cc (ks)</author>
		<pubDate>Wed, 26 Sep 2018 22:42:06 +0000</pubDate>
	</item>
</rss>
