Simple example of svg card rendering
by Nate and Snacko
Moderators: Snacko, CCGHQ Admins
Simple example of svg card rendering
by Snacko » 12 Dec 2009, 15:21
Lately I've been fooling around in C/C++ with the gtk+ rendering framework ie. cairo for image rendering and pango for font rendering. This allows for example to render the cards via SVG. Text and set symbol are SVG shapes, this only leaves the background texture and artwork as rasters.
I'm not sure if I'll finish this or when.
Here's an early example http://www.mediafire.com/?dfdmhizetzy
I'm not sure if I'll finish this or when.
Here's an early example http://www.mediafire.com/?dfdmhizetzy
Re: Simple example of svg card rendering
by Huggybaby » 13 Dec 2009, 05:22
Very interesting...the type is very clear.
-
Huggybaby - Administrator
- Posts: 3209
- Joined: 15 Jan 2006, 19:44
- Location: Finally out of Atlanta
- Has thanked: 704 times
- Been thanked: 595 times
Re: Simple example of svg card rendering
by Snacko » 13 Dec 2009, 17:36
That's because the glyphs are vectors and aren't antialiased (which blends the sharp text edges with background).
You could also drop a html file like this which shows the text is being vector scaled and redrawn at different sizes.
You could also drop a html file like this which shows the text is being vector scaled and redrawn at different sizes.
<style type="text/css"><!--
body { background: green; }
--></style>
<embed src="tmp.svg" width="736" height="1050"
type="image/svg+xml"
pluginspage="http://www.adobe.com/svg/viewer/install/" />
<embed src="tmp.svg" width="368" height="525"
type="image/svg+xml"
pluginspage="http://www.adobe.com/svg/viewer/install/" />
<embed src="tmp.svg" width="184" height="263"
type="image/svg+xml"
pluginspage="http://www.adobe.com/svg/viewer/install/" />
Re: Simple example of svg card rendering
by Incantus » 21 Feb 2010, 14:20
Hey Snacko,
Could you upload the svg file again, or any other sample cards you've made with SVG? Mediafire seems to have lost it. Also, would you be willing to share your code for vector rendering of cards? I've been thinking of moving that way for Incantus, and being able to jumpstart the layout algorithm would be awesome! Thanks.
Could you upload the svg file again, or any other sample cards you've made with SVG? Mediafire seems to have lost it. Also, would you be willing to share your code for vector rendering of cards? I've been thinking of moving that way for Incantus, and being able to jumpstart the layout algorithm would be awesome! Thanks.
Re: Simple example of svg card rendering
by Snacko » 21 Feb 2010, 21:25
This is completely work in progress as I haven't touched it since but I would want to finish it.
It doesn't yet do any font scaling to fit target space.
You can check http://www.mediafire.com/file/dh2irjjrf ... le-svg.zip
I also don't see much point in SVG other than being cool vector image that you can scale up, but what's the point when you only need not so big image and scaling it down is pretty fast while preserves quality with Lanczos filter.
The good thing about cairo is that you can easily switch backends, so the same code can render svg, gl quads, pdf, gdi under windows and much more. The downside is that ARGB textures and font rendering under windows don't mix. You get some hideous results with garbled text.
I could upload the C++ code under LGPL, but I'm not sure it's much of use at the current state.
It doesn't yet do any font scaling to fit target space.
You can check http://www.mediafire.com/file/dh2irjjrf ... le-svg.zip
I also don't see much point in SVG other than being cool vector image that you can scale up, but what's the point when you only need not so big image and scaling it down is pretty fast while preserves quality with Lanczos filter.
The good thing about cairo is that you can easily switch backends, so the same code can render svg, gl quads, pdf, gdi under windows and much more. The downside is that ARGB textures and font rendering under windows don't mix. You get some hideous results with garbled text.
I could upload the C++ code under LGPL, but I'm not sure it's much of use at the current state.
Re: Simple example of svg card rendering
by Nate » 05 Jul 2010, 12:30
I think TTF should be just as clear as SVG, no?
Re: Simple example of svg card rendering
by Snacko » 05 Jul 2010, 21:26
Yes as long as you generate at native size. The only advantage of svg is that you can generate one vector image and use it at any size, while for scalar graphics you always need to render at your target size to not lose any quality.
Re: Simple example of svg card rendering
by Incantus » 23 Sep 2010, 20:34
I built a simple interactive javascript card generator using raphaeljs (which uses SVG for those browsers that support it - ie not IE). You can play around with it at http://incant.us/creator.
8 posts
• Page 1 of 1
Who is online
Users browsing this forum: No registered users and 1 guest