Skip to content
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

OSM DATA 3D - Modélisation 2D des bâtiments suite - (4/5) #1281

Open
wants to merge 8 commits into
base: master
Choose a base branch
from

Conversation

TANK2003
Copy link
Contributor

Quatrième article d'une série de 5 sur la nouvelle version d'OSM DATA (aka son printemps) en 3D. Dans ce Quatrième article, on continue la modélisation des données 2D . La modélisation des façades cette fois ci

Merci d'avance pour votre relecture. 🙏


ℹ️ Message automatique à lire et remplir ⬇️

Liens importants

Ressources et check-list

Pour info, voici quelques extraits de notre guide de contribution :

Qualité

  • les news sont bien réparties dans les bonnes sections
  • les sections vides sont supprimées
  • vérifier le rendu de la syntaxe markdown (cf. linter)
  • chasse aux coquilles orthographiques et dyslexiques

Images

  • les images téléversées sur le CDN n'ont pas de caractère spécial dans leur nom de fichier (espace, accent, etc.) et n'excédent pas 1000px de largeur
  • les images sont hébergées sur des sites sécurisés (HTTPS)
  • chaque news a une vignette
  • les images (sauf les vignettes) ont l'attribut loading défini sur lazy (cf. MDN et guide material-mkdocs)
  • accessibilité : chaque image a un texte de remplacement (entre les crochets) et un titre lisible par les outils d'assistance. Bref, qui respecte la syntaxe générale

📢 Diffusion

Une fois l'article publié, il sera alors temps de le diffuser. Il sera automatiquement intégré au flux RSS et à la newsletter.

Mais la publication sur les réseaux sociaux est manuelle.

Nous avons des comptes officiels sur ces réseaux sociaux :

Merci d'indiquer en commentaire tes comptes à utiliser pour être cité/e dans les messages et de cocher ci-après la "stratégie" de diffusion qui te convient pour chaque réseau.

BlueSky

  • un/e membre de Geotribu publie, tu repartages avec ton compte
  • tu publies, on repartage
  • chacun/e publie de son côté
  • je souhaite que mon contenu ne soit pas diffusé sur ce réseau

LinkedIn

  • un/e membre de Geotribu publie, tu repartages avec ton compte
  • tu publies, on repartage
  • chacun/e publie de son côté
  • je souhaite que mon contenu ne soit pas diffusé sur ce réseau

Mastodon

  • un/e membre de Geotribu publie, tu repartages avec ton compte
  • tu publies, on repartage
  • chacun/e publie de son côté
  • je souhaite que mon contenu ne soit pas diffusé sur ce réseau

@github-actions github-actions bot added the articles Tutoriels, actualité, billet... label Mar 11, 2025
@Guts Guts requested review from a team, aurelienchaumet and jeremieprudhomme and removed request for a team March 18, 2025 17:27
@Guts
Copy link
Member

Guts commented Mar 18, 2025

Allez zou, c'est parti pour la @geotribu/relecture !

ℹ️ Aux relecteur/ices

Merci d'utiliser autant que possible le mode Suggestion de la review : https://docs.github.com/fr/pull-requests/collaborating-with-pull-requests/reviewing-changes-in-pull-requests/reviewing-proposed-changes-in-a-pull-request#starting-a-review

image

C'est vraiment IMPORTANT pour le confort de l'auteur/ice 🙏

cc @sguimmara

date: 2025-03-25
description: "OSM DATA 3D : des données 2D à leur représentation en 3D - suite"
icon: material/video-3d
image: https://cdn.geotribu.fr/img/articles-blog-rdp/articles/2025/osm_data/article_3/miniature.png
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

miniature à changer ?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes j'ai changé, j’hésite entre celle en place et celle ci https://cdn.geotribu.fr/img/articles-blog-rdp/articles/2025/osm_data/article_3/representation_facade.png

Je pars pour celle en place, si ca te va (

Copy link
Contributor

@jeremieprudhomme jeremieprudhomme left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Voici pour ma relecture.


WebGL ne pouvant gérer les polygones à plus de trois sommets, une triangulation est réalisée sur chaque façade du bâtiment.

On aurait pu refaire cette manipulation avec [Earcut](https://github.com/mapbox/earcut) mais on a décidé de se compliquer la vie en se rajoutant le défi de réaliser la triangulation. On considère donc le premier point du polygone, et les deux points suivants pour définir notre premier triangle. Pour le second triangle, on considère le second sommet et les deux suivants et on recommence ce processus itératif jusqu'au dernier point, ou sont alors considérés les deux premiers sommets traités. Ce traitement permet de s'assurer qu'on obtient des géométries fermées. Si vous n'avez rien compris, c'est normal, utilisez [Earcut](https://github.com/mapbox/earcut).
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
On aurait pu refaire cette manipulation avec [Earcut](https://github.com/mapbox/earcut) mais on a décidé de se compliquer la vie en se rajoutant le défi de réaliser la triangulation. On considère donc le premier point du polygone, et les deux points suivants pour définir notre premier triangle. Pour le second triangle, on considère le second sommet et les deux suivants et on recommence ce processus itératif jusqu'au dernier point, ou sont alors considérés les deux premiers sommets traités. Ce traitement permet de s'assurer qu'on obtient des géométries fermées. Si vous n'avez rien compris, c'est normal, utilisez [Earcut](https://github.com/mapbox/earcut).
On aurait pu refaire cette manipulation avec [Earcut](https://github.com/mapbox/earcut) mais on a décidé de se compliquer la vie en se rajoutant le défi de réaliser la triangulation. On considère donc le premier point du polygone, et les deux points suivants pour définir notre premier triangle. Pour le second triangle, on considère le second sommet et les deux suivants et on recommence ce processus itératif jusqu'au dernier point, sont alors considérés les deux premiers sommets traités. Ce traitement permet de s'assurer qu'on obtient des géométries fermées. Si vous n'avez rien compris, c'est normal, utilisez [Earcut](https://github.com/mapbox/earcut).

En effet, ce n'est pas très clair, surtout la dernière partie de ta longue phrase "ou sont alors considérés les deux premiers sommets traités". Je ne sais pas s'il y a moyen de rendre ça plus compréhensible en faisant des phrases plus courtes peut-être ?

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Cette méthode artisanale de triangulation permet-elle de gérer les polygones concaves ? Si non, ça vaudrait le coup de mentionner que ça ne fonctionne que pour des polygones convexes.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Il faut également préciser que cette méthode de triangulation duplique les sommets. Idéalement, (et ce que fait Earcut), c'est d'utiliser des géométries indexées, beaucoup moins gourmande en mémoire, ce qui est indispensable lorsque l'on veut afficher de nombreux bâtiments simultanément.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

La phrase méritait plus d'explication, d'autant plus que le script qui suit ne triangule pas uniquement. J'ai complété la phrase pour préciser qu'on effectue deux étapes ici : projection de chaque sommet de la toiture, tout en créant les triangles de chaque facade.

En faisant comme cela, c'est à dire en travaillant segment par segment [A, B], je pense que ca marche aussi avec les polygones concaves. Effectivement ces derniers (concave) ne fonctionneraient pas si je triangulais avec ces méthode en utilisant l'ensemble des sommets de la toiture + leurs projection.

J'ai essayé de reformulé en donnant plus de détail, et yess j'ai rajouté l'avantage d'utiliser Earcut, merci pour la remarque.

J'espère que c'est plus lisible dans sa nouvelle formulation.

Merci pour vos relectures 🙏

Comment on lines +102 to +106
<iframe height="500" style="width: 100%;" scrolling="no" title="Résumé des étapes de construction de la toitures" src="https://codepen.io/TANK2003/embed/vEBrgyo?default-tab=result" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
Allez sur le codepen <a href="https://codepen.io/TANK2003/pen/vEBrgyo">
Résumé des étapes de construction du bâtiment</a> by Karl TAYOU (<a href="https://codepen.io/TANK2003">@TANK2003</a>)
on <a href="https://codepen.io">CodePen</a>.
</iframe>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Typo sur "Squellete" -> "Squelette" pour les étapes 2 et 5

  • il y a deux étapes 5

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Merciii 🙏

@Guts Guts changed the title OSM DATA 3D - Modélisation 2D des bâtiments - suite (4/5) OSM DATA 3D - Modélisation 2D des bâtiments suite - (4/5) Mar 19, 2025
Copy link
Contributor

🎉 Le site de prévisualisation pour cette PR a été généré et est disponible sous ce lien.
Commit de référence : c0e7d57.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
articles Tutoriels, actualité, billet...
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants