search

cal-itp / data-infra

Cal-ITP data infrastructure
https://docs.calitp.org/data-infra
GNU Affero General Public License v3.0
48 stars 13 forks source link

speedmap app tweaks #2769

Closed edasmalchi closed 1 year ago

edasmalchi commented 1 year ago

User story

As a CA Transit Speed Maps user, I love the new maps! They'd just be a little easier to use with a few of these potential tweaks.

Issue created to document and assess feasibility with @atvaccaro, may not complete all

App-side Tweaks

Analyst-side tweaks

Acceptance Criteria

TBD

atvaccaro commented 1 year ago

I have a commit and a PR and I'll check things off as I complete them!

I think a couple of these are trickier than they may be worth.

  • [ ] "Loading..." or something similar displayed in map during render wait (low priority)

This is going to be mildly tricky because we're loading multiple layers asynchronously. I added a basic spinner from a library that relies on pre-existing data load events (even for tiles), so there's at least a bit of feedback, but I don't think it's really what you were imagining (i.e. a spinner while loading our data specifically). We could implement a spinner directly via spin.js, it'll just be a bit more work.

  • [ ] Fix map on mobile? (need not be a first-class experience but currently not working at all -- reloads in a loop?)

I was able to get this to load on my phone; do you want to test with a couple different devices synchronously?

  • [ ] Automatically unzip .geojson.gz on download, so download returns plain .geojson (low priority/maybe impossible?)

Currently the download link references the actual HTTPS endpoint of the file in GCS, but I think there's two ways we could do this. I don't love either of them.

  1. Add a parameter to the State that would allow you to specify a non-gzipped file to download; that would mean saving both a GeoJSON and gzipped-GeoJSON to GCS but has the advantage of avoiding any client-side work.
  2. Perform the download operation via Javascript, which basically consists of fetching the file, creating a fake link with the blob content in the DOM, and "clicking" the link via Javascript. This would avoid storing additional files in GCS but it may perform poorly on large files (10s of MB).
atvaccaro commented 1 year ago

Custom tooltip style, new type for speed variation maps (to refine)

For this, do you have a list of fields? We could re-use the same basic styling with additional fields or create something from scratch.

edasmalchi commented 1 year ago

This is going to be tricky because we're loading multiple layers asynchronously. I added a basic spinner that relies on pre-existing data load events (even for tiles), so there's at least a bit of feedback, but I don't think it's really what you were imagining (i.e. a spinner while loading our data specifically).

Sounds good, let's see what the spinner looks like but this isn't essential.

Currently the download link references the actual HTTPS endpoint of the file in GCS, but I think there's two ways we could do this. I don't love either of them.

Yeah I figured, we'll just keep it as-is

Custom tooltip style, new type for speed variation maps (to refine)

For this, do you have a list of fields? We could re-use the same basic styling with additional fields or create something from scratch.

Yeah, I'll get it to you in a bit. We might be able to do some interesting visuals since we have the p20, p50, p80 speeds and p80/p20, can talk more synchronously and/or I can do a mockup

The "opacity" param doesn't quite yield the desired effect, I think we might need to crack back open the color-handling code in the app.

So let's find time for a synchronous session to:

edasmalchi commented 1 year ago

oh and I was able to load your link to the app itself on mobile too, but I haven't been able to get them to load on the published speedmap site. Maybe something about the iframe/JupyterBook interaction?

for example this doesn't work for me on iOS/Firefox: https://analysis.calitp.org/rt/district_07-los-angeles/13__speedmaps__district_07-los-angeles__itp_id_182.html

atvaccaro commented 1 year ago

Ok I did just test on Chrome on my Pixel and it mostly works... What about Safari?

Screenshot_20230627-121519.png

atvaccaro commented 1 year ago

I'll send a calendar invite!

edasmalchi commented 1 year ago

negative on Safari File

atvaccaro commented 1 year ago

glad that both of us hit the same high-resolution-screenshots-are-massive-images problem 😂

edasmalchi commented 1 year ago

It actually loaded in Safari on my work phone (same iOS major version)

But... that phone is bigger (13 Pro vs my 13 Mini) -- perhaps implies some sort of screen size issue??

(and sparing us the even bigger screenshot lol)

edasmalchi commented 1 year ago

@atvaccaro finally rebuilt the site and it looks great!

Realized we don't quite have a mobile fix -- the view map in new tab is a good idea on its own, but since the page doesn't load properly in the first place I don't get a chance to click it! Will try to see if I can get a console/error messages out at some point

atvaccaro commented 1 year ago

Realized we don't quite have a mobile fix -- the view map in new tab is a good idea on its own, but since the page doesn't load properly in the first place I don't get a chance to click it! Will try to see if I can get a console/error messages out at some point

Ah right... let me know if you find out anything. I'll ask around and see if anyone has a iPhone/iPad they'd be willing to let us test with (just to confirm it's not just you 🤔 ).