search

gis-ops / valhalla-app

This is the demo web app running on https://valhalla.openstreetmap.de
https://valhalla.openstreetmap.de
MIT License
157 stars 87 forks source link

[BUG] Current Isochrones tab enhancement #162

Closed Sheikh-JamirAlam closed 1 year ago

Sheikh-JamirAlam commented 1 year ago

Description

What is the problem you are facing

The current Isochrone tab looks like this. "Visualized with Valhalla App" at the end is getting cut off due to the width of the tab. Also the Directions tab and the Isochrone tab should be of same width, I think that would make more sense UX wise.

What is your suggested solution

Keeping the width of Directions tab and Isochrone tab same.

I would like to work on this issue, if possible.

Screenshots

image

tommach591 commented 1 year ago

I do think that the Isochrone tab should be bigger in width, but matching the width with the Directions tab might be difficult because the Directions tab increases in width as you add more waypoints. This is because each waypoint is numbered, as the number increase in digits, so will the width.

Sheikh-JamirAlam commented 1 year ago

@tommach591 You are right when the number of waypoints increases the width of the tab changes. But I think the width change like this is kind of weird. Leaving the directions tab for now, how about I just increase the width of Isochrones tab a bit for now. The "Valhalla App" text should appear clearly and also I noticed the input search field is not vertically centered with the delete button. Maybe I can start fixing that? @nilsnolde what do you think? should I work on it? image

nilsnolde commented 1 year ago

Sure, would be appreciated, thanks. I wouldn't put too much in there for now. At some point we'll need a different layout once we want to add different endpoints for e.g. map-matching & optimized routes.

Sheikh-JamirAlam commented 1 year ago

@nilsnolde I created a PR. Also, I wanted to mention, I found this project through gsoc and when I first looked into the website, a lot of functionalities where not clear to me. Like right clicking brings the "Directions from here", "Add as via point" menu, it was not clear to me. What I am trying to say is as a person who visits the site for the first time, he/she won't be able to figure out certain features. I suggest some sort of guide/cheatsheet which can be accessed with a button where users can see different funtionalities, something like Left Click : Displays location data Right Click : Displays directions features