digirati-co-uk / iiif-canvas-panel

Investigation into component granularity
https://iiif-canvas-panel.netlify.app/
MIT License
9 stars 6 forks source link

Atlas version v2.0.9 #250

Closed stephenwf closed 5 months ago

stephenwf commented 5 months ago

@abrin This is the changes that were applied to Atlas, resolves #248

netlify[bot] commented 5 months ago

Deploy Preview for canvas-panel-storybook canceled.

Name Link
Latest commit 0ec5bac78cf953b1ce2a60ff49ddd81f38edfee8
Latest deploy log https://app.netlify.com/sites/canvas-panel-storybook/deploys/660c67cebaf96f00080393d8
netlify[bot] commented 5 months ago

Deploy Preview for iiif-canvas-panel ready!

Name Link
Latest commit 0ec5bac78cf953b1ce2a60ff49ddd81f38edfee8
Latest deploy log https://app.netlify.com/sites/iiif-canvas-panel/deploys/660c67ce6f6cb5000840e231
Deploy Preview https://deploy-preview-250--iiif-canvas-panel.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.

netlify[bot] commented 5 months ago

Deploy Preview for iiif-canvas-panel-demos ready!

Name Link
Latest commit 0ec5bac78cf953b1ce2a60ff49ddd81f38edfee8
Latest deploy log https://app.netlify.com/sites/iiif-canvas-panel-demos/deploys/660c67ce6f6cb5000840e235
Deploy Preview https://deploy-preview-250--iiif-canvas-panel-demos.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.

codesandbox-ci[bot] commented 5 months ago

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 0ec5bac78cf953b1ce2a60ff49ddd81f38edfee8:

Sandbox Source
simple-vue Configuration
vue-3-carousel Configuration
external-stylesheet-sandbox Configuration
example-sandbox Configuration
custom-preset Configuration
react-choices-example Configuration
reacting-to-the-user Configuration
external-annotation-pages Configuration
virtual-annotation-pages Configuration
loading-annotation-pages Configuration
annotation-display-1 Configuration
annotation-display-2 Configuration
choice-example Configuration
choice-react Configuration
more-regions-1 Configuration
more-regions-2 Configuration
regions-1 Configuration
regions-2 Configuration
regions-3 Configuration
regions-4 Configuration
regions-5 Configuration
regions-6 Configuration
responsive-1 Configuration
stephenwf commented 5 months ago

@abrin Using the choice example (which forces a single layer) I think I can see the issue resolved.

Before: https://codesandbox.io/p/sandbox/sandpack-project-9rhpq3?file=%2Fsrc%2Findex.js&from-sandpack=true

After: https://codesandbox.io/p/sandbox/choice-react-ftj7xs?file=%2Fsrc%2Findex.js

(After some issues getting the version pinned!)

stephenwf commented 5 months ago

There is one final bug, when setting opacity our new calculations have the opposite problem. They will (sometimes) overlap at zoom levels and create opaque lines.

image

OpenSeadragon fixes this by clearing the contents beneath before rendering, but that will not work for Atlas since you can compose images together, like this example. One option might be to clear/reset the pixels on the right and bottom. This would reduce the bug to showing lines on the image behind only - which is probably going to be less noticeable for users and rarer to see.

There might be a performance overhead with that approach though, so it would only be if there is an opacity set. If you're happy with the current implementation though, we can look at that bug later.

(link to bug: https://deploy-preview-250--iiif-canvas-panel.netlify.app/docs/examples/styling#opacity)