Polyline drawn in Tiled map do not appear in its location when displayed in simulator

Issue description :

  • Created a polyline to surround a green terrain island

  • Added property hasBody=true and bodyType=static to the polyline object

  • Save map and run corona simulator

  • observe where it appears in simulator

  • collision works no problem with the polyline object but it is appearing not surrounding the terrain

image link : https://goo.gl/LuECVt

Any idea why it is appearing like this? 

Using Berry Engine/ Tiled map editor

Yes. Tiled is using an offset for the vertex positions.

You will need to extract that offset (it should be in the record) and add it to (or subtract it from) the line vertices.

You may also be dealing with relative offset that you’ll need to calculate.

I wish I could give you a better answer, but in my experience, this offsetting varies in Tiled.

  • Polygons use one style
  • Physics bodies use another
  • Lines may use yet another.

RGTiiled handles polygons here: https://github.com/roaminggamer/SSK2/blob/master/ssk2/tiledLoader.lua (221 … 232 )

Notice the use of this SSK function: ‘offset_xy()’ which came out of a discussion here in the forums.  It calculates the relative offset of the vertices to ‘center’ them.

RGTiled handles Physics polygon bodies here: https://github.com/roaminggamer/SSK2/blob/master/ssk2/tiledLoader.lua (527-539)

Notice that the physics record has an x and y (offset) that has to be added to the vertices.  Also notice the object offset by half height/width values.  This is because  Tiled uses a corner anchor, while I’m placing the bodies by their center.

You will need to take a look at the record for the object you’re drawing and adjust accordingly.

My guess is that a polyline will be most like a polygon for adjustment purposes.

Here is the offset_xy code:

-- Get polygon center \<x,y\> based on vertices local function offset\_xy( t ) local sort = table.sort local coordinatesX, coordinatesY = {}, {} local minX, maxX, minY, maxY local function compare( a, b ) return a \> b end for i = 1, #t\*0.5 do coordinatesY[i] = t[i\*2] end for i = 1, #t\*0.5 do coordinatesX[i] = t[i\*2-1] end sort( coordinatesX, compare ) maxX = coordinatesX[1] minX = coordinatesX[#coordinatesX] sort( coordinatesY, compare ) maxY = coordinatesY[1] minY = coordinatesY[#coordinatesY] local offset\_x = (minX+maxX)\*0.5 local offset\_y = (minY+maxY)\*0.5 return offset\_x, offset\_y end

I would assume t is the object name?

No.  ‘t’ is a table of vertices

Forgive me but I do not clearly understand how I should be using this function.

Where will I get the set of vertices from polyline? 

Is there a way of doing this from UI, like moving the map grids manually?

I am using Berry Tiled Engine and I plan to continue to use this.

Sorry for asking silly questions : :frowning:

Image link : https://goo.gl/Nvvrxq

In fact found a way of offsetting grid for object layer, but it does not have any effect on what is shown on simulator

Ok I went inside the map.json file and can see coordinates of polyline :

“polyline”:[

                        {

                         “x”:0,

                         “y”:0

                        }, 

                        {

                         “x”:60,

                         “y”:0

                        }, 

                        {

                         “x”:86,

                         “y”:-18

                        }, 

                        {

                         “x”:113,

                         “y”:-16

                        }, 

                        {

                         “x”:189,

                         “y”:52

                        }, 

                        {

                         “x”:213,

                         “y”:65

                        }, 

                        {

                         “x”:211,

                         “y”:102

                        }, 

                        {

                         “x”:186,

                         “y”:113

                        }, 

                        {

                         “x”:150,

                         “y”:173

                        }, 

                        {

                         “x”:118,

                         “y”:198

                        }, 

                        {

                         “x”:112,

                         “y”:220

                        }, 

                        {

                         “x”:73,

                         “y”:205

                        }, 

                        {

                         “x”:48,

                         “y”:207

                        }],

In the map.json file I have manually subtracted each value with the offset and it seemed to work, shift in upward direction.

However this process is extremely lengthy, how can I do it from code, I dont want to do it manually in the json file?

I have printed out the x and y offset and they return 50 and 101 respectively.

Please advice.

You probably need to modify the code in Berry that makes the polyline.  Extract the x,y coordinates from the input into a table, pass it to the function, take the result and draw a line.

Easy Peasy.

Once you get it working, you might consider submitting the fix to @ldurniat for addition to the Berry module/lib.

@Idurniat : Do you think you can fix this problem from Berry code?

The issue is I am not very skilled to really understand how Berry was created, so I guess Idurniat is the right person to modify this.

Q:1) “Extract the x,y coordinates from the input”, what do you mean by this?

  • Do you say that I should extract the coordinates from the map.json file? Is that the input file?

Q:2) The function provides the offset, what do I do with the offset x and y values? Subtract from the table of x and y coordinates to adjust?

Sorry for asking silly question, but I think this is an issue in the Berry engine :

Observation : subtracting the offset values from the coordinates, do take the polyline closer. However this effort is a killer for me…there can be 20 points in a polyline, need an automatic solution.

Please suggest @Idurniat  or @roaminggamer : Is there any engine which does this adjustment automatically?

I’m staying out of this.  If @Idurniat  has time to add this feature to Berry that’s great, but since Berry is open source you may simply need to figure this out on your own.

Whatever the case, the change would be made to Berry not your data and once implemented correctly, it will work for all cases.

Does RGTiled take care of this automatically?

Nope.  I haven’t implemented Polylines in RGTiled.  I have never needed the feature.

Regardless, switching away from Berry if you have already created significant content would be a waste of time.

Do you have a budget?  I’d be happy to consider changing Berry as a hit.

I have created significant amount of content with Berry, so I am reluctant to move away from it.

I will try to dig through the issue and if possible implement a fix in Berry with help of Idurniat.

My apologies, I am an indie developer who at the moment do not have any budget and learning my way up, otherwise I would have seriously considered it. Thanks for your help so far. 

Hi ahmed_shahjada,

Fixed :slight_smile:

Have a nice day:)

ldurniat 

@ldrniat - Nice and elegant fix!

Thanks a million to Idurniat.

I was just wondering if this was a bug or was thought of like a design for polyline initially?

Bug.