Showing folium(based on leaflet.js) map with PyQt desktop(+web) app
This is not the static map viewer, this is basic client-server side web app.
Server side is using the 5000 port. Therefore, you should check whether the port 5000 is already in use or not.
- folium
- QtWebEngineView
- jinja2 - to use javascript in the Python source
- flask (Python web framework, it needs to build the web app) - to save the information in DB
- flask_cors - to fix the CORS error
- git clone ~
- python -m pip install PyQt5-stubs - if this is not installed, QtWebEngineWidgets might not work
- python -m pip install PyQtWebEngine
- python -m pip install folium
- python main.py
This script doesn't support error log on its own(it is very hard), so we need to use the browser like Chrome, Edge, Firefox.
- Go to the root directory
- Open the script.py file and uncomment the code below
# for test by browser
# app.run()
- python server.py
- open map.html
- Chrome, for example, you can see the log to figure it out it works well or not. It doesn't work for some reasons, you can fix the error on your own.
This is very basic one. Zoom in and out and you can see the country's name and region or anything like that
You can switch between each tile by clicking on each radio button.
Each time you click one of them, the Folium HTML file is saved and the QWebEngineView is reloaded.
main.html will be generated for showing the folium map. main.html contains folium related scripts.
- Toggle the sidebar
- Connect one's route to the other
- Stop the server when the web app is closed
- Add feature to export it as DB
- Get the location's name with tooltip
Note: examples on the list are the static map viewer. It doesn't use the server-side at all.