How to create an editable 3D city map based on OSM?

Question

F4 map allows you to create 3D images based on OSM maps.

I want to create an application, which allows you to edit such 3D map, i. e. remove and add buildings and roads (without modifying the underlying OSM data).

How can I do this?

My first thought was to

1. take F4 map client,
2. modify it so that it gets the data not from OSM, but from my web service.

Then, when the user removes a building in the browser, the client-side code sends a request to a web service and the building is removed from the database. Same for adding buildings, roads and everything else.

I'm wondering, if there are better approaches.

If there is any existing code, which I can re-use for my purposes, please tell me.

Update 1:

• It seems that F4 map's source code is not available publicly.
• CesiumJS seems to be able to render maps with buildings.

Answer 1

Your question is quiet complex and as others say it's highly recommended to have a look at the 3D OSM Wikipages before.

So to splitup your problem you need:

• JS webmap with 3D abilities for the clientside
• OSM 3D processor on the serverside
• OSM custom API for your custom CRUD operations on objects
• OSM database

As you see, it's getting complex. You might want to start with an static 3D isometric map as OSM2World etc. and react to on-click events. So you can begin coding the API. If this works, start the components for live 3D views.

P.S.: Keep in mind that your DB and the official DB will get out of sync, if you delete objects the hard way.

Recommendation: Don't do any DB changes without prior discussion of your project!