Pixels to vectors

Monkey Forums/Monkey Programming/Pixels to vectors

frank(Posted 2012) [#1]
All the hype seems to be to use vector graphics instead of pixels (SVG and such). How can that best be implemented with Monkey? For Javascript it can be SVG. But the rest? It would give a big boost on mobile if possible; iOS / Android cannot (unless I missed something) render SVG as backgrounds for buttons or whatever which is a huge miss, especially for android with so many resolutions. Any ideas?


AdamRedwoods(Posted 2012) [#2]
How can that best be implemented with Monkey?

This is a bigger concept than we think. THere are two ways to get SVG/vector graphics.

1. native libraries for each platform
-- maintaining libraries would be quite a chore.
2. pure monkey solution
-- the amount of research and skill in excellent vector renderers is staggering. just look at the agg library:
http://www.antigrain.com/research/index.html

but a pure monkey solution could be done as long as everyone realizes it isnt the perfect solution. and it would be difficult to approach non-hardware (msaa) anti-aliasing. it would require a spline triangulation routine, svg parser, and a mojo integration.

research:
http://http.developer.nvidia.com/GPUGems3/gpugems3_ch25.html
http://cworth.org/~cworth/papers/cairo_ddc2005/html/


frank(Posted 2012) [#3]
Seems it would be more feasible to use native libs then? Trying to keep the Monkey layer thin. But yes, obviously it is a big chore to get this done but it would be kind of a great thing for an environment like Monkey. Not many other environments have it, and you would LIKE to have this across the board so you don't have to worry about those pesky things like different resolutions.


dragon(Posted 2012) [#4]
svg is very slow...

only what can work is something like textured 2d-polygons

today we can do this using MiniB3D with flat models

or we should create new editor and SIMPLE file format (no need using 3D-software):

'file format:
tris
x,y,u,v 'triangle 1 point 1
x,y,u,v 'triangle 1 point 2
x,y,u,v 'triangle 1 point 3
...


only problem is that is possible that you have no antialiasing,
but some type of texture antialiasing


something like:
http://udn.epicgames.com/Two/ShapeEditor.html

more advanced:
http://www.brashmonkey.com/

blender for 2d:
http://blog.greweb.fr/2012/04/blender-as-a-2d-game-map-editor-proof-of-concept/


frank(Posted 2013) [#5]
Thanks, I was checking SVG engines and although they might be slow, they could be used to generate the images for your 2D game in the background right? And then use them as normal tiles/sprites in the game? I'm just annoyed with all those resolutions (esp on Android) for 2D art while i'm designing in Inkscape anyway; it would be quite logical using the Inkscape exports for everything to finetune to your device's resolution.

Edit: considering the flexibility of InkScape: http://duriansoftware.com/joe/Using-Inkscape-as-a-map-editor.html it would be so fantastic if the output could be supported directly. With SVG they can (there are SVG kits/support open source for every Monkey target) but probably not in-game (too slow), so reading input and rendering it on offscreen images while 'loading' (loading itself would be faster as much less bitmaps need to be loaded) and even caching the result if possible (everything but html5 I guess) would make this really cool IMHO.


frank(Posted 2013) [#6]
Made a bit of a start

https://github.com/tluyben/MonkeyStuff/tree/master/svg

for the HTML5 version, will add other targets later.


frank(Posted 2013) [#7]
Result: http://o7.no/WNfP7U

Question: when does Monkey copy data over from test.data to build/data ? Because it refuses to copy my .svg file; I have to actually copy it manually. How can I make that work automatically like it does with images.

Edit: I played around:

BINARY_FILES="*.bin|*.dat|*.svg"

in CONFIG.MONKEY

fixes the issue. All works now :)