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 thumbnail error in previous analysis #492

Merged
merged 3 commits into from
Mar 27, 2023
Merged

Conversation

danielfdsilva
Copy link
Collaborator

@danielfdsilva danielfdsilva commented Mar 23, 2023

I picked this one up since it was a quick win.

When the encode polygon is too complex I'm getting the bounding box and showing the corners (kind of a scope).

image

I decided on the corners instead of a polygon, so that a bounding box polygon is not confused with a square-ish AOI.
Thoughts?

@netlify
Copy link

netlify bot commented Mar 23, 2023

Deploy Preview for veda-ui ready!

Name Link
🔨 Latest commit 118c9c6
🔍 Latest deploy log https://app.netlify.com/sites/veda-ui/deploys/6421830074f3e00008c6a02a
😎 Deploy Preview https://deploy-preview-492--veda-ui.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 settings.

@nerik
Copy link
Contributor

nerik commented Mar 27, 2023

Issue: #455

Copy link
Contributor

@nerik nerik left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This looks super cool 🤘

const src = `https://api.mapbox.com/styles/v1/covid-nasa/cldac5c2c003k01oebmavw4q3/static/geojson(${encoded})/auto/480x320?access_token=${process.env.MAPBOX_TOKEN}`;
// If more than 8000 chars the request will fail.
// In this case simplify and show a bounding box.
if (encoded.length > 8000) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It would be nice to store that value in a self-describing constant.

const makeCorner = (p1, p2, p3) => ({
type: 'Feature',
properties: {
'stroke-width': 8,
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is that value related to the generated thumbnail zoom level? In that case, isn't there a risk of having visually different stroke widths?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Screenshot 2023-03-27 at 10 58 56

Nevermind this - looks good on different zoom levels.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For completeness:
the stroke width is dependent on the image size. In this case it's 480x320 (but used in a smaller size) which is why it has such a high value (8)

Co-authored-by: Erik Escoffier <erik@developmentseed.org>
@danielfdsilva
Copy link
Collaborator Author

@nerik I had definitely not understood that. 😅 Addressed

@nerik nerik merged commit d7fc6bb into main Mar 27, 2023
@nerik nerik deleted the feature/455-thumbnail-error branch March 27, 2023 11:52
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