[2.5D Map] Show direction arrows similar like in the 3D map

[wolfgang-ch]

The current direction arrows are using bitmaps which has UI limits when displayed rotated.

This very first approach is using a circle instead of an arrow 2.5D/3D symbol, this will be the next step but first learning of OpenGL skills is needed

[wolfgang-ch]

After many many hours and days of try and error, I could finally setup a dev environment to easily edit/test the vtm sources

MT commit [2.5 Map] Using "vtm-parent" plugin for vtm development https://github.com/mytourbook/mytourbook/commit/7c01221bf98cc860b263239f4f8089f49b8e1adb

VTM commit [2.5D Map] "vtm-parent" plugin setup for vtm development https://github.com/mytourbook/vtm/commit/db276c489586bbd0b495137707901eaf66f9620c

[wolfgang-ch]

Finally, now static symbols are painted on the tour path but the more complex math part for me is coming, that the direction arrows are showing in the correct direction

https://user-images.githubusercontent.com/1283445/184494653-259e00e0-de86-42f6-aca4-22462e1ba8d2.mp4

[wolfgang-ch]

Direction arrows are now working :-))))

What helped me a lot for the math, examples in the internet, e.g.

• https://stackoverflow.com/questions/31462791/find-coordinates-to-draw-arrow-head-isoscele-triangle-at-the-end-of-a-line#answer-31469874
• https://stackoverflow.com/questions/51369452/get-coordinates-of-arrow-of-a-line-point
• https://math.stackexchange.com/questions/963331/finding-coordinates-of-cap-of-an-arrow

https://user-images.githubusercontent.com/1283445/184596881-d65b6cca-f2a3-45aa-ac03-a3754c51e9ad.mp4

But there are some issues

• Arrows have not yet the same size (easy to fix)
• Some very big arrows, black areas (propably not very easy to fix)

[wolfgang-ch]

Implementing and testing 2.5D map features is sometimes creating nice effects which were not intended

https://user-images.githubusercontent.com/1283445/184815374-0e94a417-8b66-4252-b953-3d573c6c2bc6.mp4

[wolfgang-ch]

Should this be the next direction arrow ?

https://user-images.githubusercontent.com/1283445/186596069-c7ceaff8-56a1-4c98-82c8-81509b837e37.mp4

[telemaxx]

looks like a Paperplane, nice.

the current position could be an animated bicycle or an walking man. instead of the point.

https://m.youtube.com/watch?v=f3Cr8Yx3GGA

[FJBDev]

looks like a Paperplane, nice.

the current position could be an animated bicycle or an walking man. instead of the point.

And the MT user will choose their favorite icon in the MT preferences 😄

[wolfgang-ch]

looks like a Paperplane, nice. the current position could be an animated bicycle or an walking man. instead of the point.

And the MT user will choose their favorite icon in the MT preferences 😄

... or can add their blender file

[FJBDev]

... or can add their blender file

That seems advanced for a "normal" user

[wolfgang-ch]

Paperplane arrows are now working :-)

Fin height = 0

https://user-images.githubusercontent.com/1283445/187062914-2a2fecb5-781a-4afd-9513-f8abd1be059f.mp4

Fin height > 0

https://user-images.githubusercontent.com/1283445/187062897-9f1405a9-096e-417a-a80e-1fd85b6adedc.mp4

Currently the fins have a typical 3D issue, z-fighting, the marked fins should not be visible, they are from the arrows which are behind the others.

[wolfgang-ch]

Z-Fighting is now fixed

@telemaxx Can the "old" direction arrows now be replaced with the new arrows ?

[wolfgang-ch]

With one middle fin it looks like an area of sharks

[telemaxx]

@telemaxx Can the "old" direction arrows now be replaced with the new arrows ?

Yes of course, you're arrows/sharks are looking a lot cooler than my arrows and they are also visible when the map i tilted a lot.

[wolfgang-ch]

The sharks are also in the water

[wolfgang-ch]

The arrow head is set to be +1 higher than the arrow tail, when both have the same z-axis value and are overlapping, then the overlapping part was flickering, caused by the concurrent fragment shader cores.

[wolfgang-ch]

The direction arrow settings are now saved in the track option profiles

https://user-images.githubusercontent.com/1283445/187932207-605e5a8f-f82f-4f68-a3a3-5711153a0b4d.mp4

[wolfgang-ch]

There are a few track color issues when the opengl depth buffer is activated for the track. It seems that the line shader algorithm is not supporting track opacity:

• Track corners are flickering when navigating the map
• Track inner color is opaque for the direction arrow wings but the background is not opaque
• Direction arrow wings are painted above the track outline color but should be below

https://user-images.githubusercontent.com/1283445/188626899-518b908a-38ed-4ab3-b628-5e305bcd2fe3.mp4

In the video it was not visible that the track inner color in not opaque for the background

[wolfgang-ch]

Many direction arrows

[telemaxx]

good 3D Benchmark.

how was the Performance, could you turn and move in Realtime?

[wolfgang-ch]

I recorded this video with 30 fps and it is smoothly

https://user-images.githubusercontent.com/1283445/189275473-97c9402a-19ea-47be-add8-39da8ae5ef2a.mp4

Last week I saw this video where each item is also moved and is not static as the direction arrows

https://www.youtube.com/watch?v=kuy17LVDESk&list=PLRL3Z3lpLmH1EF4g__4gPevJhTArzy0k5

It also performs very good with all my tours

[wolfgang-ch]

On the road to a new feature there are sometimes interresting effects.

https://user-images.githubusercontent.com/1283445/190184299-31b2f3c0-da7f-42c4-910b-c0c73ae10661.mp4

[wolfgang-ch]

The animation speed can now be selected

https://user-images.githubusercontent.com/1283445/190844735-7655229d-67ae-4897-9e71-727e4e8fae4f.mp4

When the 2.5D map is losing the focus, then the framerate will drop to 1 fps otherwise the selected fps is used. Dropping the fps to 1 will reduce the power consumption (and the pc vent could also stop earlier)

Power consumption with 30 fps

Power consumption with 1 fps

Is there a need to run animations when the 2.5D map do not have the focus ?

[wolfgang-ch]

With https://synthclipse.sourceforge.net/ the shader file editor (c++ editor) has similar features as when it would be a java file, HOWEVER this tool is not compatible with Mylyn tasklist, both need the same plugin but with different versions, so I'm using a separate Eclipse instance

[wolfgang-ch]

When profiling the OpenGL drawing commands then the directions arrows are consuming the least performance, most is consumed by painting the map

[wolfgang-ch]

This animated triangle is now using a different approach than the prevous animated arrows. The triangle position is now computed in the shader (GPU) and not in the CPU. This allows now to move different models on the tour track.

It took me some day's to finally get a working solution for the first step 😄 but there are additional steps, correct direction, smooth moving, ... 👷

https://user-images.githubusercontent.com/1283445/194008270-808f2274-1b82-429a-a8c2-b3c5cb05f0da.mp4

[FJBDev]

Nice :+1:

[wolfgang-ch]

One small step further

https://user-images.githubusercontent.com/1283445/194483909-1311c38b-1e26-445d-be3c-9c108ecb9854.mp4

[wolfgang-ch]

Now it looks better, OpenGL has invinite possibilities, when you understand it

https://user-images.githubusercontent.com/1283445/194580289-3286428f-d401-4305-90c4-6bc1c2f2b05f.mp4

[FJBDev]

it looks better, OpenGL has invinite possibilities

Does that mean that in the future, MT will require a minimum graphic card specification (CPU, RAM) to use the 2.5 D map ?

[wolfgang-ch]

it looks better, OpenGL has invinite possibilities

Does that mean that in the future, MT will require a minimum graphic card specification (CPU, RAM) to use the 2.5 D map ?

The 2.5D map is mostly not settting a GLSL version, so they use version 110. I just saw that version 120 is set for the circle drawer.

For the direction arrow shaders only, I raised the version to 330 to can use the "modern" (12 year old) in/out syntax.

Until now I don't know which version I need in the future but a new feature could be set optional that the shader do not need to be loaded, which is currently not yet implemented, currently all shaders are loaded at once.

https://en.wikipedia.org/wiki/OpenGL_Shading_Language

[wolfgang-ch]

The smoothed animation is now working 😄

The minimal angle which is set in the video to 3°, could be set to be even more smooth.

https://user-images.githubusercontent.com/1283445/195176293-4dc232cd-be9d-4cd3-8a07-662ee1bdc2f5.mp4

[wolfgang-ch]

I started to implement a map player that the animation can be controlled but there are still many desired features which needs to be implemented, e.g. start/stop/pause

https://user-images.githubusercontent.com/1283445/196047207-e9dc985b-b34d-46c9-82f2-dd3a9b991fdc.mp4

[FJBDev]

I started to implement a map player that the animation can be controlled but there are still many desired features which needs to be implemented, e.g. start/stop/pause

Very nice feature!! 👍 Can you implement it in a way so that the player can be reused for the 2D and 2D maps ?

[wolfgang-ch]

It's already prepared for any map but animations in 2D map is total different than in 2.5D or 3D map

[wolfgang-ch]

The map player is now implemented https://github.com/mytourbook/mytourbook/issues/948

[wolfgang-ch]

Moved the computation of the animated angle into the shader preparation code, the angle is now computed in each frame and not computed for all frames before the animation starts.

The reason was, when the animation is looped, then the symbol jumped when moving from the end to the start but I didn't thought, that it's now also smoothed when the animation is paused, it is turning the symbol into the correct direction 😄

https://user-images.githubusercontent.com/1283445/196899914-a880949a-d967-4967-ad28-2950dceb78e0.mp4

https://user-images.githubusercontent.com/1283445/196899908-f9d3a86e-8148-40d9-a9c1-616846d53bf1.mp4

[FJBDev]

Will that "relive" feature be in 22.next ?

EDIT: It would be nice it there was a feature to play the arrow while drawing the track

[wolfgang-ch]

Now with re-live, the position is not yet perfect but it is working https://github.com/mytourbook/mytourbook/commit/816164349000c8888aa81e4fbb57ab159059079f

Now I anticipate the next feature requests:

• Sync (center) map with animated position
• Draw only the last n positions

https://user-images.githubusercontent.com/1283445/197123523-88fffd1d-2c69-4557-8078-70d1dd9fa498.mp4

[wolfgang-ch]

I've found now a promising glTF loader and viewer https://github.com/javagl/JglTF/issues/79#issuecomment-1290052404 which I'll try to use in MT to replace the moving triangle

[wolfgang-ch]

Now I'll try to implement the animated figure with the jMonkeyEngine and then draw (blend) this animation image (Texture2D) into the 2.5D map, per frame.

All of this is done with OpenGL but yesterday I discovered that there are now 2 programs (contexts) using the same OpenGL environment at the same time. This is however supported since a long time and objects can be shared between different OpenGL contexts but it makes the whole idea even more complex.

What me helps is that there are examples in the web, e.g. https://gregnott.wordpress.com/some-usefull-facts-about-multipul-opengl-contexts/

This is the idea for my next MT steps. Does it work, theoretically yes but the time will tell.

[wolfgang-ch]

jMonkeyEngine seems to be not a simple solution https://hub.jmonkeyengine.org/t/use-jmonkeyengine-with-an-external-main-loop/46164 now plan B, I'll try to use libGDX but the current used version must be lifted up in the VTM map otherwise the gltf models do not work https://github.com/mapsforge/vtm/discussions/971

[wolfgang-ch]

Now I'll try to use https://github.com/mgsx-dev/gdx-gltf for libGDX animations and found some nice free models on https://sketchfab.com/ like the above, but some models failed or have issues when running in gdx-gltf.

However the way is still very long to replace the above animated triangle with an animated 3D model but now it seems that I've found everything which is needed to implement it.

https://user-images.githubusercontent.com/1283445/202741924-def9500c-a732-4b9f-8f40-8fd473a3ff80.mp4

https://user-images.githubusercontent.com/1283445/202747417-451e8ccf-b579-4627-8403-2da9bef93b5b.mp4

[FJBDev]

That's fancy 3D 😄 Can't wait to see what it looks like in MT!

[wolfgang-ch]

Today I discovered that there is a 3D poi layer https://github.com/mytourbook/vtm/blob/332a694d653db2d49e044f3b91945e014766319a/vtm-gdx-poi3d/src/org/oscim/gdx/poi3d/Poi3DLayer.java#L63 for the 2.5D map 😄

However it gets very slow when increasing the window size but it is using libGDX models which I also will use for the map animation, so it seems to be a good example where I can learn from.

https://user-images.githubusercontent.com/1283445/203366311-59ab8b80-b438-47a3-8bdc-cc7d1c4b8996.mp4

The trees are randomly placed, e.g. cover a memorial, is in the center of a crossing or a street

[wolfgang-ch]

Found an even better layer, with these 3 lines of code, a 3D model can be placed at any location

[telemaxx]

sometimes it can be easy.

did the models produce a shadow like the buildings?

[wolfgang-ch]

sometimes it can be easy.

It looks now easy but it's not. Now I've 2 different running implementations which I have to merge somehow. Both are using the same com.badlogic.gdx.graphics.g3d.Model but the environment is different, however this finding is still very helpfull.

did the models produce a shadow like the buildings?

Currently I don't care about details 😄

When I get this animation to be working, then shadows could be implemented with libGDX and other cool things.

[wolfgang-ch]

The glTF loader has also a demo program where you can test some configurations, also the shadow

https://user-images.githubusercontent.com/1283445/203706989-a30e86f9-4c38-4c2a-9f74-c22d2e030adb.mp4

[wolfgang-ch]

This is the very very first running 3D animation with the 2.5D map 😎

OK, there are issues with the car but a rotation should fix it 😄

Yesterday evening the code almost worked but it could not find the path to the shader code and I was too tired to get it fixed. Today I added the jar to the vtm plugin and then it worked 😄

https://user-images.githubusercontent.com/1283445/203915439-d8e89ced-d446-4a67-be08-64e1639e4f8a.mp4

Now with the correct rotation

https://user-images.githubusercontent.com/1283445/203924088-0c1ed093-7de0-4e68-9d53-ef9a2544d6de.mp4

[wolfgang-ch]

The animation is not yet perfect, it could be more smooth and better positioned at the head of the triangle, but it moves now along a tour track

https://user-images.githubusercontent.com/1283445/204142511-ec7aabda-ea9e-4c7e-9b27-bf0db7f9ed08.mp4