mirror of
https://github.com/almet/notmyidea.git
synced 2025-04-29 12:02:39 +02:00
Edits
This commit is contained in:
parent
e8d48a9dfc
commit
07f0d967aa
1 changed files with 15 additions and 9 deletions
|
@ -1,7 +1,6 @@
|
||||||
---
|
---
|
||||||
title: Adding collaboration on uMap, third update
|
title: Adding collaboration on uMap, third update
|
||||||
tags: umap, geojson, websockets
|
tags: umap, geojson, websockets
|
||||||
status: draft
|
|
||||||
---
|
---
|
||||||
|
|
||||||
I've spent the last few weeks working on [uMap](https://umap-project.org), still
|
I've spent the last few weeks working on [uMap](https://umap-project.org), still
|
||||||
|
@ -52,7 +51,7 @@ uMap appears to be doing a lot of different things, but in the end it's:
|
||||||
|
|
||||||
- Using [Leaflet.js](https://leafletjs.com/) to render *features* on the map ;
|
- Using [Leaflet.js](https://leafletjs.com/) to render *features* on the map ;
|
||||||
- Using [Leaflet Editable](https://github.com/Leaflet/Leaflet.Editable) to edit
|
- Using [Leaflet Editable](https://github.com/Leaflet/Leaflet.Editable) to edit
|
||||||
complex forms, like polylines, polygons, and to draw markers ;
|
complex shapes, like polylines, polygons, and to draw markers ;
|
||||||
- Using the [Formbuilder](https://github.com/yohanboniface/Leaflet.FormBuilder)
|
- Using the [Formbuilder](https://github.com/yohanboniface/Leaflet.FormBuilder)
|
||||||
to expose a way for the users to edit the features, and the data of the map
|
to expose a way for the users to edit the features, and the data of the map
|
||||||
- Serializing the layers to and from [GeoJSON](https://geojson.org/). That's
|
- Serializing the layers to and from [GeoJSON](https://geojson.org/). That's
|
||||||
|
@ -79,7 +78,7 @@ features (with their properties). But that's the trick: these features are named
|
||||||
|
|
||||||
#### GeoJSON and Leaflet
|
#### GeoJSON and Leaflet
|
||||||
|
|
||||||
We're using GeoJSON to share data with the server, but we're using Laflet
|
We're using GeoJSON to share data with the server, but we're using Leaflet
|
||||||
internally. And these two have different way of naming things.
|
internally. And these two have different way of naming things.
|
||||||
|
|
||||||
The different geometries are named differently (a leaflet `Marker` is a GeoJSON
|
The different geometries are named differently (a leaflet `Marker` is a GeoJSON
|
||||||
|
@ -103,7 +102,7 @@ get updated without being centralized. It's just a different paradigm.
|
||||||
|
|
||||||
With that in mind, I started thinking about a simple way to implement syncing.
|
With that in mind, I started thinking about a simple way to implement syncing.
|
||||||
|
|
||||||
I let aside all the thinking about how this would relate with CRDTs. It can
|
I left aside all the thinking about how this would relate with CRDTs. It can
|
||||||
be useful, but later. For now, I "just" want to synchronize two maps. I want a
|
be useful, but later. For now, I "just" want to synchronize two maps. I want a
|
||||||
proof of concept to do informed decisions.
|
proof of concept to do informed decisions.
|
||||||
|
|
||||||
|
@ -161,8 +160,8 @@ way is probably websockets.
|
||||||
Here is a simple code which will relay messages from one websocket to the other
|
Here is a simple code which will relay messages from one websocket to the other
|
||||||
connected clients. It's not the final code, it's just for demo puposes.
|
connected clients. It's not the final code, it's just for demo puposes.
|
||||||
|
|
||||||
A basic way to do this on the server side is to use python's [websockets]
|
A basic way to do this on the server side is to use python's
|
||||||
(https://websockets.readthedocs.io/) library.
|
[websockets](https://websockets.readthedocs.io/) library.
|
||||||
|
|
||||||
```python
|
```python
|
||||||
import asyncio
|
import asyncio
|
||||||
|
@ -285,14 +284,21 @@ I'm now able to sync different types of features with their properties.
|
||||||
<source src="/images/umap/sync-features.webm" type="video/webm">
|
<source src="/images/umap/sync-features.webm" type="video/webm">
|
||||||
</video>
|
</video>
|
||||||
|
|
||||||
|
Point properties are also editable, using the already-existing table editor. I
|
||||||
|
was expecting this to require some work but it's just working without more
|
||||||
|
changes.
|
||||||
|
|
||||||
## What's next ?
|
## What's next ?
|
||||||
|
|
||||||
While I'm able to sync map properties, features and their properties, I'm not
|
I'm able to sync map properties, features and their properties, but I'm not
|
||||||
yet syncing layers. That's the next step! I also plan to make some pull
|
yet syncing layers. That's the next step! I also plan to make some pull
|
||||||
requests with the interesting bits I'm sure will go in the final
|
requests with the interesting bits I'm sure will go in the final
|
||||||
implementation:
|
implementation:
|
||||||
|
|
||||||
- adding ids to features
|
- Adding ids to features, so we have a way to refer to them.
|
||||||
- having a way to map properties with how they render the interface
|
- Having a way to map properties with how they render the interface, the `renderProperties` bits.
|
||||||
|
|
||||||
|
When this demo will be working, I'll probably spend some time updating it with the latest changes (umap is moving a lot these weeks).
|
||||||
|
I will probably focus on how to integrate websockets in the server side, and then will see how to leverage (maybe) some magic from CRDTs, if we need it.
|
||||||
|
|
||||||
See you for the next update!
|
See you for the next update!
|
||||||
|
|
Loading…
Reference in a new issue