Add visualization #83

PierrickP · 2022-08-29T07:20:43Z

Add a visualization tool to get an overview of the GBFS feed

I changed the homepage to have 2 different pages, validation /validator and visualization /visualization.

ℹ️ https://gbfs-validator.netlify.app/?url=XXX will be correctly redirected to /validator

Features

Summary of stations / vehicles counts
Show a dot for each freefloating vehicles
- color per form factor
- popup to get all details (vehicule_type_id / plan_id are expended)
Show a dot for each stations
- color according to the number of vehicles inside
- popup to get all details (merge of station_informations and station_logs)
Show polygons of geofencing zones
popup with details

Missing

Better colors for geofencing zones according to rules
Pricing tables / Simulator

I created a new function to only return content's feed (faster than also validate).

I tested with multiple feeds / versions (not 3.0) but some issues can be still there.
Invalid feed can show nothing or break the page.

⚠️ I used my own Mapbox key (https://github.com/MobilityData/gbfs-validator/pull/83/files#diff-c5580fd8f5f02724fac95dbe8fa01c1ecd4efee526378be9f0b96b1d84704c99R40)
MobilityData can create an account a use their own key (Should be totally free for the number of visitors, but a credit card may be required).
We can switch to another tiles' server.

netlify · 2022-08-29T07:20:47Z

✅ Deploy Preview for gbfs-validator ready!

Name	Link
🔨 Latest commit	`632f22f`
🔍 Latest deploy log	https://app.netlify.com/sites/gbfs-validator/deploys/64941197a4ccc40009a1c659
😎 Deploy Preview	https://deploy-preview-83--gbfs-validator.netlify.app/
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

…ad1e 2b6ad1e FIX: replaces name field with localized string (MobilityData#82) abe71f2 Fix invalid json, no trailing commas (MobilityData#83) git-subtree-dir: gbfs-validator/versions/schemas git-subtree-split: 2b6ad1ec46824413bbf477c556744e99991f814c

davidgamez

LGTM

functions/feed.js

functions/validator.js

PierrickP · 2023-06-15T12:34:34Z

Hi @davidgamez, on my last commit I added a new function that exposes the openapi schema of the api.
It can be imported into Postman to get the available endpoints with parameters.

davidgamez · 2023-06-17T01:02:26Z

Hi @davidgamez, on my last commit I added a new function that exposes the openapi schema of the api. It can be imported into Postman to get the available endpoints with parameters.

Thanks!

richfab · 2023-06-21T18:49:18Z

website/src/pages/Visualization.vue

+const MAPBOX_KEY =
+  'pk.eyJ1IjoicGllcnJpY2twIiwiYSI6ImNsaWluZjl6bDF3emQzZW9iZHZ2NDd5MDMifQ.FCTTnlXknFjxmw9NLemYsQ'


Thank you @PierrickP for this amazing contribution!

We set up an environment variable in Netlify to avoid exposing the Mapbox key in the code.

We created three tokens under MobilityData Mapbox account and added to Netlify VITE_MAPBOX_API_KEY per context:

PROD

STAGING - branch the preview deployment

LOCAL - local netlify cli

Please let us know if you agree with this approach. Thank you!

Suggested change

const MAPBOX_KEY =

'pk.eyJ1IjoicGllcnJpY2twIiwiYSI6ImNsaWluZjl6bDF3emQzZW9iZHZ2NDd5MDMifQ.FCTTnlXknFjxmw9NLemYsQ'

const MAPBOX_KEY = import.meta.env.VITE_MAPBOX_API_KEY

cc @davidgamez

That's an excellent improvement. Thanks for that. I've stored the Tokens in 1Password, in the Public transit vault.

👍 i made the changes

davidgamez · 2023-06-21T20:06:55Z

.netlify/edge-functions-import-map.json

@@ -0,0 +1 @@
+{"imports":{"netlify:edge":"https://edge.netlify.com/v1/index.ts"}}


Is it any reason why we need this file? I think we can delete the file and potentially add .netlify folder to .gitignore.

Signed-off-by: Pierrick <mulotmail@gmail.com>

PierrickP · 2023-06-26T07:39:27Z

I rebased, if everybody is ok, can we merge ?

CONTRIBUTING.md

README.md

davidgamez · 2023-06-26T15:41:44Z

I rebased, if everybody is ok, can we merge ?

Merging now!

…058d 22b058d fix: incorrect spec for "languages" property in system_information.json (MobilityData#90) e9d891b Refer to later versions in gbfs_versions.json (MobilityData#87) fbd3ced Add v3.0 to v3.0-RC schemas (MobilityData#88) ef0d9a6 Fix schemas for v3.0-RC (MobilityData#85) 2b6ad1e FIX: replaces name field with localized string (MobilityData#82) abe71f2 Fix invalid json, no trailing commas (MobilityData#83) f43170e V3.0-RC Schemas (MobilityData#79) 680df70 Update pr-to-project.yml c2c30a2 Typo fix in geofencing_zones.json (MobilityData#78) c9be765 Create pr-to-project.yml 0a17875 Create issues-to-project.yml 30e5a3a Update README.md git-subtree-dir: gbfs-validator/versions/schemas git-subtree-split: 22b058dc4a358baf451e006cde74775075929b3d

* Git ignore for schemas subtree Signed-off-by: Tom <1955774+tdelmas@users.noreply.github.com> * Squashed 'gbfs-validator/versions/schemas/' changes from 5273f96..22b058d 22b058d fix: incorrect spec for "languages" property in system_information.json (#90) e9d891b Refer to later versions in gbfs_versions.json (#87) fbd3ced Add v3.0 to v3.0-RC schemas (#88) ef0d9a6 Fix schemas for v3.0-RC (#85) 2b6ad1e FIX: replaces name field with localized string (#82) abe71f2 Fix invalid json, no trailing commas (#83) f43170e V3.0-RC Schemas (#79) 680df70 Update pr-to-project.yml c2c30a2 Typo fix in geofencing_zones.json (#78) c9be765 Create pr-to-project.yml 0a17875 Create issues-to-project.yml 30e5a3a Update README.md git-subtree-dir: gbfs-validator/versions/schemas git-subtree-split: 22b058dc4a358baf451e006cde74775075929b3d * remove dot files in schemas Signed-off-by: Tom <1955774+tdelmas@users.noreply.github.com> * v3-RC validation Signed-off-by: Tom <1955774+tdelmas@users.noreply.github.com> * Remove unused file Signed-off-by: Tom <1955774+tdelmas@users.noreply.github.com> * Add `serverOpts` required in Windows Signed-off-by: Tom <1955774+tdelmas@users.noreply.github.com> * Fix typo `recommended` Signed-off-by: Tom <1955774+tdelmas@users.noreply.github.com> * update test for 3.0-RC , 3.0 and upcoming minor versions Signed-off-by: Tom <1955774+tdelmas@users.noreply.github.com> * fix after rebase Signed-off-by: Tom <1955774+tdelmas@users.noreply.github.com> * Recommended. Signed-off-by: Tom <1955774+tdelmas@users.noreply.github.com> * Squashed 'gbfs-validator/versions/schemas/' changes from 22b058d..5f12243 5f12243 Patch manifest.json (#91) git-subtree-dir: gbfs-validator/versions/schemas git-subtree-split: 5f12243d5735a608eef697212a627b9090eea31a --------- Signed-off-by: Tom <1955774+tdelmas@users.noreply.github.com>

PierrickP force-pushed the feature/visualization branch from 5455c08 to 77963cc Compare June 9, 2023 08:57

MobilityData deleted a comment from netlify bot Jun 9, 2023

PierrickP marked this pull request as ready for review June 9, 2023 15:43

davidgamez approved these changes Jun 12, 2023

View reviewed changes

functions/feed.js Show resolved Hide resolved

functions/validator.js Show resolved Hide resolved

richfab reviewed Jun 21, 2023

View reviewed changes

davidgamez reviewed Jun 21, 2023

View reviewed changes

PierrickP added 5 commits June 22, 2023 11:16

Add Visualization

65e9042

Signed-off-by: Pierrick <mulotmail@gmail.com>

Fix for some feeds

a51e130

Signed-off-by: Pierrick <mulotmail@gmail.com>

Add openapi schema on /.netlify/functions/doc

7f1d48f

Signed-off-by: Pierrick <mulotmail@gmail.com>

Remove and ignore .netlify

c474255

Signed-off-by: Pierrick <mulotmail@gmail.com>

Fix for environment variables

632f22f

Signed-off-by: Pierrick <mulotmail@gmail.com>

PierrickP force-pushed the feature/visualization branch from 82a9aa2 to 632f22f Compare June 22, 2023 09:17

josee-sabourin requested a review from davidgamez June 23, 2023 13:46

davidgamez reviewed Jun 26, 2023

View reviewed changes

CONTRIBUTING.md Show resolved Hide resolved

README.md Show resolved Hide resolved

davidgamez approved these changes Jun 26, 2023

View reviewed changes

davidgamez merged commit 22d1b07 into master Jun 26, 2023

davidgamez deleted the feature/visualization branch June 26, 2023 15:42

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add visualization #83

Add visualization #83

PierrickP commented Aug 29, 2022 •

edited

Loading

netlify bot commented Aug 29, 2022 •

edited

Loading

davidgamez left a comment

PierrickP commented Jun 15, 2023

davidgamez commented Jun 17, 2023

richfab Jun 21, 2023

fredericsimard Jun 21, 2023

PierrickP Jun 22, 2023

davidgamez Jun 21, 2023

PierrickP Jun 22, 2023

PierrickP commented Jun 26, 2023

davidgamez commented Jun 26, 2023

		const MAPBOX_KEY =
		'pk.eyJ1IjoicGllcnJpY2twIiwiYSI6ImNsaWluZjl6bDF3emQzZW9iZHZ2NDd5MDMifQ.FCTTnlXknFjxmw9NLemYsQ'

	const MAPBOX_KEY =
	'pk.eyJ1IjoicGllcnJpY2twIiwiYSI6ImNsaWluZjl6bDF3emQzZW9iZHZ2NDd5MDMifQ.FCTTnlXknFjxmw9NLemYsQ'
	const MAPBOX_KEY = import.meta.env.VITE_MAPBOX_API_KEY

		@@ -0,0 +1 @@
		{"imports":{"netlify:edge":"https://edge.netlify.com/v1/index.ts"}}

Add visualization #83

Add visualization #83

Conversation

PierrickP commented Aug 29, 2022 • edited Loading

Features

Missing

netlify bot commented Aug 29, 2022 • edited Loading

✅ Deploy Preview for gbfs-validator ready!

davidgamez left a comment

Choose a reason for hiding this comment

PierrickP commented Jun 15, 2023

davidgamez commented Jun 17, 2023

richfab Jun 21, 2023

Choose a reason for hiding this comment

fredericsimard Jun 21, 2023

Choose a reason for hiding this comment

PierrickP Jun 22, 2023

Choose a reason for hiding this comment

davidgamez Jun 21, 2023

Choose a reason for hiding this comment

PierrickP Jun 22, 2023

Choose a reason for hiding this comment

PierrickP commented Jun 26, 2023

davidgamez commented Jun 26, 2023

PierrickP commented Aug 29, 2022 •

edited

Loading

netlify bot commented Aug 29, 2022 •

edited

Loading