Jump to content

Filling A Polygon With A Texture


SamStorms
 Share

Recommended Posts

I'm new here, though not new to game programming :)

I'll try being short and to the point. My university's final year project is a Car Racing (2D top-down) game that takes any (ANY) route of the player's choice from Google maps and turns it into a race track. Then the player challenges their friends and race in real-time multiplayer. And the game is made in Phaser.

 

I can take the array of points returned by the maps API and convert those into Cartesian coordinates and draw the whole track, with the boundaries of the road and everything. The problem I'm facing now is that I have a rectangular road texture, and I want to fill that shape generated from the points of the route with that road texture.

 

Now, I asked this question to someone before and they suggested that I make the rectangular texture into a trapezoid and manipulate the individual sections, the more the sections the smoother the fill will be. Makes sense in theory.

 

However, I can't find anything related to this in Pixi. Using another topic, I did learn how to skew images in HTML5 Canvas, but I can't figure out how to go about doing this in Pixi.

 

Any help would be appreciated :) Thanks for reading!

 

PS: Here's what my application can do, at the moment (apologies, I couldn't upload the picture here directly for some reason):

 

itworks_zpsxcw3vszv.png

Link to comment
Share on other sites

I believe the uv's should handle that.

 

Could you please elaborate that a bit? The Rope object wraps the whole texture around the array of points one gives it. It would be better to tile the texture instead of wrapping it around the shape. How would I manipulate the UVs in order to do that?

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...