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

fix(113) adjust location of annotation; shrink x axis range if screen… #121

Open
wants to merge 2 commits into
base: main
Choose a base branch
from

Conversation

robertmiddlekauff
Copy link

@robertmiddlekauff robertmiddlekauff commented Dec 28, 2023

adjust location of annotation; shrink x axis range if screen is small; format axis and tooltip

Description

This PR seeks to address issue 113: #113

This PR limits the amount of data that is shown on smaller screens because there are simply too many data points to display with the current data setup. The user can still scroll left if they know the chart well, but I am making an assumption about a mobile user that they just want to see the last 12 months and don't necessarily need to see the full dataset.

It also formats the axis to be percentage bc even though it's calculated as a ratio it's really a percentage of the total trips. This will make it slightly easier to process what the chart means.

I also adjusted the location of the annotation to account for these changes and make the data on the chart bigger and reduce whitespace.

Checklist

  • I am requesting to merge into the dev branch
  • I have performed a self-review of my code
  • I have commented my code, particularly in hard-to-understand areas
  • I have made corresponding changes to the documentation (dont think this is needed)
  • My changes generate no new warnings

Screenshots

Before After

|
Screenshot 2023-12-28 at 10 40 59 AM
|
Screenshot 2023-12-28 at 10 41 12 AM
|
|
Screenshot 2023-12-28 at 10 43 51 AM

   |  
Screenshot 2023-12-28 at 10 43 56 AM
  |

Copy link

netlify bot commented Dec 28, 2023

Deploy Preview for creative-quokka-61f1f5 ready!

Name Link
🔨 Latest commit a02dfd5
🔍 Latest deploy log https://app.netlify.com/sites/creative-quokka-61f1f5/deploys/658da5e60ff1560009d81739
😎 Deploy Preview https://deploy-preview-121--creative-quokka-61f1f5.netlify.app/
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

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

Copy link

netlify bot commented Dec 28, 2023

Deploy Preview for sprightly-muffin-751ffc ready!

Name Link
🔨 Latest commit a02dfd5
🔍 Latest deploy log https://app.netlify.com/sites/sprightly-muffin-751ffc/deploys/658da5e6258e1e00094944fb
😎 Deploy Preview https://deploy-preview-121--sprightly-muffin-751ffc.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

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

@KyleDolezal
Copy link
Collaborator

@robertmiddlekauff Thank you for this fix! To ask a quick question: is the shift from "normal" to "compact" mode meant to happen dynamically as one resizes, or is the intended behavior that the shift occurs only with a refresh. When doing some testing, I was able to see exactly the desired behavior you screenshotted, but only when I performed a refresh.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants