-
Notifications
You must be signed in to change notification settings - Fork 13
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Migrate the main map to Deck.gl #773
base: main
Are you sure you want to change the base?
Conversation
Will fix #552 @davidmurray If you want to work on some tasks related to this issue, let me know and you can do PR on https://github.com/tahini/transition/tree/deck-gl-pow branch to get it in this PR |
@davidmurray Je suis à faire fonctionner les événements pour créer un nouveau path, et on dirait que ça construit le path à l'envers. Est-moi de mon côté ou serait-il possible que les flèches du path animé soient inversées? Car l'array se fait dans la direction à laquelle je m'attends (nouveau noeud en arrière), mais l'animation me montre l'autre direction. |
@davidmurray Pas besoin de fixer le problème, juste me dire si tu es certain de la direction des flèches, sinon, je vais regarder de mon côté. |
@tahini Ça se peut, je ne me souviens plus si c'était dans la bonne direction. Quand tu prends le même path (pré deck.gl et post deck.gl), l'animation change de sens? Le code que j'ai push provient à 80% de https://github.com/visgl/deck.gl/tree/master/modules/extensions/src. Ça me surprendrait qu'ils aient fait une erreur. Mais si c'est le cas on pourrait peut-être juste ajouter un |
fc128bc
to
7c27395
Compare
62ad89b
to
fda3073
Compare
@kaligrafy @greenscientist ready for review, see the #552 issue for what was done and what would be left to do as separate and later issues. I think, the minimial viable product for deck.gl support is there. Please test it if you can to make sure I didn't miss anything important. |
@@ -265,11 +265,17 @@ | |||
"General": "Préférences générales", | |||
"DefaultSection": "Section par défaut lors de l'ouverture", | |||
"InfoPanelPosition": "Position du panneau d'information", | |||
"MapStyle": "Fond de carte", | |||
"DefaultColor": "Couleur par défaut", | |||
"DefaultWalkingSpeedKph": "Vitesse de marche par défaut (km/h)", | |||
"DefaultWalkingSpeedKphHelp": "La vitesse de marche varie selon l'âge et le genre entre 3 km/h (personnes âges et jeunes enfants) et 7 km/h (personnes jeunes et/ou très actives). Les hommes sont en moyenne un peu plus rapides que les femmes et de manière générale, la vitesse de marche diminue avec l'âge. La vitesse d'une personne en chaise roulante manuelle varie entre 2 et 3 km/h selon la force physique.", |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
personnes âges -> personnes âgées
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Don't have much comments, a few small things about commented code.
I imagine we have tested the custom tile that we are using in prod?
@@ -74,37 +74,37 @@ class Toolbar extends React.Component<LayoutSectionProps, TransitionToolbarState | |||
} | |||
|
|||
onUpdateLayers = () => { | |||
const layersVisibility = {}; | |||
/* const layersVisibility = {}; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Want to keep this commented code?? If so it would need a comment.
@@ -100,106 +149,48 @@ const onNodeSectionMapClick = (e: MapboxGL.MapMouseEvent) => { | |||
); | |||
newTransitNode.startEditing(); | |||
serviceLocator.selectedObjectsManager.select('node', newTransitNode); | |||
serviceLocator.eventManager.emit('selected.updateAutocompleteNameChoices.node', getRoadLabelAround(map, e)); | |||
// FIXME Migration to DeckGL: reimplement this |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is those FIXME/TODO documented in issues?
Retour en draft. J'ai un léger doute sur les performances, pour des grandes agences, je veux faire qq tests avant. |
Alors j'ai ajouté [enfin] une option de config pour désactiver les animations de carte. ça va rendre certains utilisateurs heureux et permettre aux gens comme moi avec des GPU moins performants de ne pas être trop demandant. |
e7352a9
to
a68c5fe
Compare
@tahini So we don't forget, can you comment here on that is the current blocker for this PR |
Back to draft. It still needs the polygon selection tool to be complete. I worked on it friday, it works. I just need to fine-tune when to show it. |
Working layers using geojson data, events and custom shader Co-authored-by: Wassim27 <[email protected]> Co-authored-by: Gabriel Bruno <[email protected]> Co-authored-by: Florence Lauer <[email protected]> Co-authored-by: MohamedAli-M <[email protected]> Co-authored-by: mahdiguermache <[email protected]> Co-authored-by: nik498 <[email protected]>
Current state: no background, simple geometries are displayed. All enabled layers are displayed, with proper color if that color is in the properties, otherwise, it is a default color. There is no interaction with the layers and the circles are very small when zoomed out. The selected shaders do not work. The original layer descriptions in the layers.config.ts file have not been changed or updated yet. The information they contain may be useful for the Deck.gl data, but we'll need to take each field and see how to define/type it for best Deck.gl support
For now, only three styles are available: OSM, positron and dark matter from CartoDB. Eventually, we can extend to also use MapTiler's tiles, but his requires an API key.
READMEs remain to be updated
The type is named `MapLayer` and another type `LayerConfiguration` is used to configure the layer by the application. The configuration is meant to be fixed by the application and does not change, except through Preferences, if necessary.
Performance could be improved, but it works sufficiently well for now
TripsLayer is for animating a fading path, but we don't need that for general transit lines.
* Change the API of the event handlers * Drop support of mapbox types in event handling * Change the events to use the new API * mouseDown/Move/Up are now onDrag and onDragEnd events, which happen only with a specific feature, these are easier * There are simple tooltip events, which simplify popup management when only a simple text is required * The `click` event is separate in `leftClick` and `rightClick` TODO: The `path.hoverNode` and `path.unhoverNode` are not yet functional, as they programatically need to create a popup or menu at a specific location. TODO2: Aesthetic changes are not taken into account, as zoom events (and other layout events) are not yet properly handled TODO3: Not all layers are refreshed, even though the collection they display has elements that have changed. For example, saving a path does not show the updated path. Deck.GL does a shallow comparison to determine if the layer needs to be refreshed and probably the shallow comparison does not show any change if the coordinates changed.
Deck gl does a shallow comparison of the data to determine if the layer needs to be updated. So the data is not refreshed by default if one of the features in the collection changed position. We could add a `dataComparator` function, but this will be executed for every re-render of the map. We instead use an updateCount to save the number of times a layer has been updated throught the `map.updateLayer[s]` event. This will cause the data to be refreshed whenever the count is incremented.
Bring back all mapbox styles for circle-type layers. Type the layer description for circle layers, with fields being either a number/color, a function receiving the feature in parameter, or a property getter to retrieve the value from a geojson property.
Bring back most of mapbox styles for line-type layers. The highlight uses autoHighlight instead of changing the line width. The 'animatedArrowPath' also share a good part of the configuration and re-use the same logic for the PathLayer's data.
Bring back the mapbox styles for the polygon layers. With the lineColor and fillColor, it is not necessary to have both a polygon and a stroke layer, one layer does them all.
Deck.gl is now implemented in mainline Transition and the poc is not necessary anymore.
Add the `featureMinZoom` property, which can be a function that takes the feature in parameter and return the minimum zoom at which this feature should be displayed. Use this property for the transitPaths layer to recover the functionality previously handled by the defaultFilter of mapbox.
Add the `canFilter` layer property. Because we need to know from the start the number of filters to enable for a layer, as it is sent to the shader and not updatable, even with the updateTrigger, this property allows to set a placeholder filter for all features when no other filter is set. See if this can be prevented somehow. The PathMapLayerManager is renamed to TransitPathFilterManager because it does not involve layers, but manages the filters. This class emits the filter update events. The event is caught by the map, which updates the layer accordingly.
What remains that still depended on mapbox are the popup manager, which tracks which popup are currently opened and where, and the polygon draw tool, which is a little known feature of transition and only used for node selection. Some code was commented, other removed, but those features are expected to come back soon, tuned for deck.gl.
Defaults to `true`, but can be set in the user preferences. Layers can then use the `map.enableMapAnimations` preferences value to disable animations.
Add a prop to disable animation on the `AnimatedArrowPathLayer`. This deactivates the animated frame request and arrow path time step, thus saving the GPU from calculations. The previous speed divider of 0 also had the effect of making the path not move, but the layer was still refreshed for every frame, impacting GPU performances.
Step by step migration to the Deck.gl library for maps.