How do I simulate vector terrain

What is the best way to create a smooth terrain similar to what a vector could do - arches, hills - roundness in general. I know that we can make a few good shapes in Construct 2 such as a circle and anything up to 8 angles (triangle, square, etc.), but I don't think that's enough to make a smooth environment for realistic physics.

Maybe if the terrain is cut into very small pieces and polygons are set just right that might work, but it's very time consuming. Imagine having to do a hundred levels like that...

Desired effect:

Best case scenario with multiple sprites cut for polygons:

Any ideas?

To make it work with physics let us think would you would have to do with just box2d. It has similar limits as with C2: circle shapes and polygons, but no recommended limit on the point count. This is just to point out that that library has no concept of other curves so most things need to be approximated by polygons.

Probably the simplest to do in C2 would be to use a sprite with it's origin on the left and a height of 1. You'd take the vector image and break it up into a poly line alone the edges, then create a sprite per each line. The actual drawing of the terrain could probably be done with the canvas object.

The one con would be possible tunneling because we'd have only a thin wall to collide with. You'd probably need to set the physics property "bullet" to on. It could work with other behaviors but having objects get stuck inside the terrain is more likely.

Another option instead of a thin collision edge around the terrain you could take the polyline edge around each shape and triangulate it, then take those triangles and split them into right triangles and create a bunch of right triangles. This would give a more solid feel to the shapes, but the object count would be much higher. Not to mention getting a good trianglulator working would take a bit of time.

To do either in an automated way you'd need to make a vector image file format reader or somehow export just the polygon lists for easy reading.

Edit:

Here's a physics test of the first idea:

https://www.dropbox.com/s/8mq9enadn2xvq ... .capx?dl=1

/examples31/curved_physics.capx

I made the curve in inkscape and exported as a plt file since that seemed to be the simplest to parse.

seems to work ok.

Edit2:

Here's further testing. The image from inkscape was also exported and used as an image.

https://www.dropbox.com/s/5yhh6eycbxxck ... .capx?dl=1

/examples31/curved_physics2.capx

Wow, this is a great proof of concept! I hope you don't mind if I keep a copy of these .capx on the side <img src="{SMILIES_PATH}/icon_e_smile.gif" alt=":)" title="Smile">

And it seems to be holding quite well with performance. The only downside I see is that it'd be an overkill for straight lines.

I was looking at games I've played in the past with "smooth" terrain such as Hill Climb Racing, Super Stickman Golf, etc and I remembered that Bike Race (https://play.google.com/store/apps/deta ... orld&hl=en) had an online level editor - http://www.bikerace.com.

Looking at it right now it seems like what they do is actually not that bad. According to them a polygon with 40 points per 360 degrees is the magic number or 10 points for a 90 degree curve. It's something very similar to your solution. Here's an example: https://www.dropbox.com/s/vmw992v9xnkc4 ... .capx?dl=0

Now, creating the actual path in Construct 2 would still be time consuming and I can't think of anything that can make this any faster, unless the level path is drawn with separately coded editor and imported as script, but then it wont be visible from within Construct 2.

For straight lines it actually is less points, so it's not a problem. It is also possible to simplify it first is the object count is too high i'd imagine. It may also be possible to change how may points Inkscape saves.

As far as editors go it seems simple enough to just use Inkscape. At least it would be my preference.

I finally got around to do this again since my last try a few weeks back.

Your example was quite helpful and I did manage to make it work with SVG polygon, but it's a bit buggy. First dot goes to x0y0, SVG coordinates are flipped vertically, and ball has no friction, but with a bit of tweaking it might be fixed.

Anyway, I was thinking about what you said earlier about the Canvas plugin. Is there a way to feed raw data into it? I found an extension for Adobe Illustrator called Drawscript that can output quite a lot. E.g.:

fill(255,255,255);
strokeWeight(1);
stroke(0,0,0);
bezier(661,508,663,506,671,508,671,508);
line(671,508,671,518);
line(671,518,661,518);
bezier(661,518,661,518,660,511,661,508);
[/code:1gdyzmfv]

I guess making some sort of parser with events could read this code, but just wondering if there's something build into the plugin.

I'm also not sure, is it possible to add physics to the Canvas or should another physics object be made that follows the Canvas path and draws the terrain?

P.S. we need a feature like [youtube video="vlL-u9NxfOA"] integrated into C2, it'd make our lives so much easier...

I haven't looked at your capx yet.

You could use that in JavaScript run with the browser object. You wouldn't be able to access the canvas plugin but you could still use a html canvas and return it's asURL string to load in a Sprite or some other object. Still it would still just be an image and that doesn't help with collisions.

Well looking at that draw script again, you'd need to convert it over to canvas functions, they wouldn't work as is.

In editor editing of curves isn't possible in C2, but probably in C3.

At this point I really don't want to implement level editor (which might solve the issue once and for all) and complicate the situation more than it already is.

I might have to rethink my gameplay and tune it to the limitations of C2. It's really sad to think that we cannot create good physics based games with the provided tools, whether it's C2 or Box2D's fault, or even my own for the lack of knowledge.

Thank you again for the great example you made earlier, I really do believe it's the best that can be done with the tools provided.

To make it work with physics let us think would you would have to do with just box2d. It has similar limits as with C2: circle shapes and polygons, but no recommended limit on the point count. This is just to point out that that library has no concept of other curves so most things need to be approximated by polygons.

Probably the simplest to do in C2 would be to use a sprite with it's origin on the left and a height of 1. You'd take the vector image and break it up into a poly line alone the edges, then create a sprite per each line. The actual drawing of the terrain could probably be done with the canvas object.

The one con would be possible tunneling because we'd have only a thin wall to collide with. You'd probably need to set the physics property "bullet" to on. It could work with other behaviors but having objects get stuck inside the terrain is more likely.

Another option instead of a thin collision edge around the terrain you could take the polyline edge around each shape and triangulate it, then take those triangles and split them into right triangles and create a bunch of right triangles. This would give a more solid feel to the shapes, but the object count would be much higher. Not to mention getting a good trianglulator working would take a bit of time.

To do either in an automated way you'd need to make a vector image file format reader or somehow export just the polygon lists for easy reading.

Edit:

Here's a physics test of the first idea:

https://dl.dropboxusercontent.com/u/542 ... ysics.capx

I made the curve in inkscape and exported as a plt file since that seemed to be the simplest to parse.

seems to work ok.

Edit2:

Here's further testing. The image from inkscape was also exported and used as an image.

https://dl.dropboxusercontent.com/u/542 ... sics2.capx

R0J0hound

Please, you could restore the download link?

vubidugil

links updated in original post