Connecting, stitching, and rendering your overworld areas together in a 2D RPG.

This is an issue I’m facing right now, and couldn’t come up with a good solution, however bad it may be when compared to old school RPG games that has overworlds.

You have a lot of areas of different sizes and shapes. In each areas there are connection points where two different areas meet. I’m having problems with moving my character to and from any two areas, and couldn’t render them together on the screen with the connection points connected correctly.

For a visual example, I’m trying to do something like this, but with areas broken into separate pieces. That overworld map is the entire world of Pokémon Blue.

Does anyone have clues as to how this was achieved? Thanks in advance.