{"id":20284672,"url":"https://github.com/ovesco/vismap","last_synced_at":"2026-03-19T15:04:17.213Z","repository":{"id":35962513,"uuid":"220546290","full_name":"ovesco/vismap","owner":"ovesco","description":"Project for the visualisation course","archived":false,"fork":false,"pushed_at":"2023-01-05T00:44:19.000Z","size":16945,"stargazers_count":0,"open_issues_count":31,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-01-14T08:09:34.530Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ovesco.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-11-08T20:56:15.000Z","updated_at":"2019-12-12T23:23:39.000Z","dependencies_parsed_at":"2023-01-16T10:00:23.602Z","dependency_job_id":null,"html_url":"https://github.com/ovesco/vismap","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ovesco%2Fvismap","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ovesco%2Fvismap/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ovesco%2Fvismap/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ovesco%2Fvismap/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ovesco","download_url":"https://codeload.github.com/ovesco/vismap/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":241780465,"owners_count":20019058,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-14T14:20:58.309Z","updated_at":"2026-03-19T15:04:17.177Z","avatar_url":"https://github.com/ovesco.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Vismap\n\nDisponible sur: https://vismap.guillaumehochet.now.sh/\n\n## Contexte\nAvec des transports de plus en plus nombreux et de moins en moins chers, le tourisme est en pleine expansion. De nombreuses régions basent leur économie sur le tourisme.\n\nCependant avec l'explosion d'offres, il est compliqué pour un touriste de savoir où aller et quoi chercher. Certains préfèrent se fier aux comparatifs offerts par des sites comme Trivago, mais d'autres préfèrent se balader et se fier à leurs envies.\n\nLe problème étant que pour ces derniers, il peut être difficile de savoir où se promener.\n\n## Objectif\nLe but de se promener et de mettre en évidence des zones d'intérêts au niveau d'une ville ou d'une partie d'une ville.\n\nDans de nombreuses villes touristiques, des quartiers de magasins et de restaurants se forment. L'idée est de profiter de ces regroupements d'établissements pour définir des zones d'intérêts en fonction du nombre d'établissement, de leur prix et de leur note.\n\n## Sources de données\nL'application peut récupérer les données grâce à l'API Google Maps qui fournit les établissements près d'un point géographique. Ainsi les données sont intégrées et mises à jour par les utilisateurs eux-mêmes.\n\nCependant, en phase de développement, nous travaillons en local et il n'est donc pas possible de whitelister l'adresse du site web. Hors l'API refuse les requêtes d'adresses non-whitelistées. Ainsi nous avons téléchargé en local un jeu de données.\n\n## Visualisation\nLe site affiche une carte de la région avec les zones d'intérêts. Chaque établissement peut être désigné soit par un marqueur, soit au travers d'une heatmap en fonction du niveau de zoom.\n\nLe marqueur a été choisi pour signaler précisément la position d'un établissement. C'est est une icone encrée dans la culture ce qui facilite la compréhension du touriste et il permet de voir aisément les regroupement de points.\n\nCependant il a quelques limites, si le niveau de zoom sur une carte est trop faible, le touriste n'arrive plus a interprété la distance réelle entre deux établissements en fonction de la distance sur la carte. Ainsi il ne sait pas si les deux établissements sont rapprochés. Il peut arriver qu'il y aie trop d'établissements pour qu'on puisse voir la différence de nombre entre deux regroupements. C'est le phénomène qu'a mis en évidence Shannon. Si un symbol est trop présent, il perd son information.\n\nPour palier ce problème d'interprétation, lorsque le niveau de zoom est faible, les marqueurs sont remplacé par une heatmap. Cela permet de visualiser plus facilement l'intérêt d'une région en se basant simplement sur une échelle d'intensité.\n\nAinsi le passage de l'un-à-l'autre permet au touriste de visualiser facilement le regroupement d'établissements avec la heatmap et de passer à des marqueurs pour visualiser plus précisément la position des établissements.\n\nNous avons choisis d'utiliser les couleurs pour indiquer si un établissement est ouvert ou non. Comme il y a trois états possibles : ouvert, inconnu ou fermé, nous nous sommes inspirés des feux de signalisations pour rester dans la culture des touristes. La couleur verte indique que l'établissement est ouvert, le rouge, fermé et l'orange, pour ceux dont nous n'avons pas l'information.\n\n![VisMap](img/vismap.png)\n\n### Interactivité\nPour plus de clarté nous avons sélectionné une liste d'interactivités qui sont les plus utilisées. Ces interactivités sont constamment visibles, les autres sont cachées dans un menu caché.\n\nLes widgets constamment visibles :\n- Filtre par type d'établissement\n- Zoom / dézoon\n- Gestion de l'affichage du menu\n\nMenu caché :\n- Filtre par ouverture\n- Filtre par niveau d'étoile\n- Affichage par heatmap\n- Affichage par marqueur\n\n![Filtre](img/filter.png)\n#### Filtres\n\n##### Type d'établissement\nLe touriste peut modifier sa recherche en fonction de sa motivation. S'il souhaite plutôt manger, il peut filtrer par type d'établissement.\n\nLes types des établissements sont définis par des listes de labels. Pour la méthode de sélection de labels nous nous sommes inspirés des méthodes classiques de recherche par tags. Une barre de recherche a été mise en place.\n\nUn double-clic permet d'afficher une liste déroulante tous les labels possibles, le touriste peut taper du texte et la liste des labels sera filtrée en fonction de si le label contient les données ou non. Une fois qu'un label est sélectionné, il reste visible dans une bulle dans la barre de recherche.\n\nAinsi le touriste peut voir facilement quel type d'établissement il recherche. La liste déroulante lui permet de voir toutes les possibilités et le filtre du texte permet de trouver plus rapidement le type souhaité.\n\n##### Ouverture\nSi le touriste recherche un établissement dans l'immédiat, il peut filtrer pour n'afficher que ceux qui sont ouverts. Cela lui permet de ne garder que l'information utile.\n\n##### Niveau d'étoiles\nDans Google, les utilisateurs peuvent évaluer les établissements avec des étoiles allant de 0 à 5. C'est une méthode établie dans de nombreux sites d'évaluation et qui permet d'évaluer globablement la qualité d'un établissement. Nous avons utilisé ces information pour filtrer la qualité minimale qu'accepte le touriste pour éviter les zones mal fréquentées avec de mauvais établissements.\n\n#### Zoom\nLe touriste peut adapter la taille de la région qu'il recherche en fonction de son moyen de locomotion grâce à une fonction de zoom / dézoom.\n\nSuivant les habitudes des utilisateurs, il est possible de le faire à l'aide du scroll et de l'écartement de doigt sur le touchpad. Pour un utilisateur peu habitué à l'informatique de classiques boutons \"+\" et \"-\" ont été intégrés.\n\nCela permet au touriste facilement d'adapter la carte pour tout d'abord chercher une région globale avec un niveau de zoom faible et d'ensuite rechercher plus précisément un quartier et situer sa propre position sur la carte.\n\n#### Affichage heatmap\nLe touriste peut définir jusqu'à quel niveau de zoom la heatmap à l'aide d'un slider. Cela lui permet d'adapter son affichage en fonction du nombre de regroupement d'établissements visibles.\n\n#### Affichage marqueur\nLe touriste peut donc définir à partir de quel niveau de zoom les marqueurs à l'aide d'un slider. Celui permet d'adapter son affichage en fonction de la précision nécessaire.\n\n## Critiques de l'outil\nL'outil a le désavantage de se baser sur l'API Google. Suivant la région, elle peut manquer de données et les informations pour chaque établissement est assez aléatoire.\n\nNous avons choisi de nous baser au maximum sur des éléments de la culture ce qui nous a permis d'avoir un outil intuitif qui nécessite peu d'explications. L'interface en est allégé et va au coeur du message. Un touriste peut rapidement prendre l'outil en main.\n\nNous avons évitéun maximum de montrer les informations d'un établissement pour éviter que le touriste se perde dans des détails. S'il souhaite avoir des informations complètes et comparer les établissements, il se tournera vers un site d'évaluation ou de comparatif.\n\nL'outil a une faible précision, mais il n'en a pas besoin. Il cherche à fournir une information primaire pour que le touriste puisse s'orienter rapidement vers une direction, une zone de la carte.\n\nNous avons suivi les préceptes de Schneiderman etmis en place un maximum actions possibles pour éviter d'écrire et ainsi avoir une utilisation plus fluide. Nous avons tout de même garder l'utilisation du langage pour palier au problème d'une liste d'informations (la liste de types d'établissements) trop longue.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fovesco%2Fvismap","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fovesco%2Fvismap","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fovesco%2Fvismap/lists"}