Panzoom: Fonctionnalité : Possibilité de définir une limite de panoramique ou une limite de remplissage

Créé le 23 juin 2020  ·  4Commentaires  ·  Source: timmywil/panzoom

Quel problème cette fonctionnalité résout-elle ?

Décrivez la solution que vous souhaitez
La possibilité de définir une limite de panoramique aux objets en cours de panoramique
c'est à dire:
boundRatioVertical={0.8}
boundRatioHorizontal={0.8}

Décrivez les alternatives que vous avez envisagées
La contain: 'inside' a un style similaire, mais je dois pouvoir basculer entre les niveaux de zoom tout en maintenant la limite du ratio de remplissage

feature votes needed

Commentaire le plus utile

Merci d'être revenu vers moi si rapidement.

Peut-être que je ne comprends pas complètement contain: inside . D'après ce que je comprends de sa mise en œuvre : le nœud panzoom ne pourra plus zoomer au-delà de la zone rectale de son parent, mais je veux que l'utilisateur puisse zoomer, contain: inside n'autorise pas mon objet à zoomer au-delà de la fenêtre.

Mon cas d'utilisation : j'ai une carte historique de grande résolution - que je veux qu'un utilisateur puisse faire un panoramique, elle est trop grande pour voir l'objet entier mais je ne veux pas qu'un utilisateur "perde la carte" en la poussant trop loin d'un côté, ce qui ressemble à contain: outside mais j'aimerais qu'ils aient un contrôle complet du zoom, pour effectuer un zoom arrière complètement mais pour explorer davantage en zoomant.

Je pense que le problème vient des limitations que je rencontre à la fois inside et outside

  • inside suppose que l'image est suffisamment petite pour tenir dans la fenêtre et a des effets étranges sinon
  • outside suppose que l'image doit AU MOINS occuper la totalité de la fenêtre

où je pourrais imaginer un contain: 'bounds' qui permettrait à une image de zoomer et de se déplacer, et lorsque l'image est plus grande que la fenêtre d'affichage et que vous arrivez au bord ou au coin, elle revient au bord respectif

Tous les 4 commentaires

Merci d'avoir ouvert un sujet. Pardonnez-moi si je comprends mal la fonctionnalité, mais cela ne pourrait-il pas être accompli en ajoutant un élément wrapper et en utilisant contain: 'inside' ?

Merci d'être revenu vers moi si rapidement.

Peut-être que je ne comprends pas complètement contain: inside . D'après ce que je comprends de sa mise en œuvre : le nœud panzoom ne pourra plus zoomer au-delà de la zone rectale de son parent, mais je veux que l'utilisateur puisse zoomer, contain: inside n'autorise pas mon objet à zoomer au-delà de la fenêtre.

Mon cas d'utilisation : j'ai une carte historique de grande résolution - que je veux qu'un utilisateur puisse faire un panoramique, elle est trop grande pour voir l'objet entier mais je ne veux pas qu'un utilisateur "perde la carte" en la poussant trop loin d'un côté, ce qui ressemble à contain: outside mais j'aimerais qu'ils aient un contrôle complet du zoom, pour effectuer un zoom arrière complètement mais pour explorer davantage en zoomant.

Je pense que le problème vient des limitations que je rencontre à la fois inside et outside

  • inside suppose que l'image est suffisamment petite pour tenir dans la fenêtre et a des effets étranges sinon
  • outside suppose que l'image doit AU MOINS occuper la totalité de la fenêtre

où je pourrais imaginer un contain: 'bounds' qui permettrait à une image de zoomer et de se déplacer, et lorsque l'image est plus grande que la fenêtre d'affichage et que vous arrivez au bord ou au coin, elle revient au bord respectif

Cela ressemble à un comportement unique et je ne sais pas comment le construire dans la bibliothèque. Je pense que vous pouvez vous lier à l'événement panzoomzoom et modifier l'option de contenu en "extérieur" lorsqu'une limite est atteinte. J'avais l'habitude d'avoir une option 'auto' pour contain qui alternait entre inside et outside fonction de la taille de l'élément par rapport au conteneur. Lorsqu'il est plus petit que le conteneur, il sera défini sur 'inside' , lorsqu'il est plus grand, 'outside' . Cela garantirait que l'image était zoomable mais toujours visible. Quoi qu'il en soit, je vais laisser cela dans l'étiquette des votes pour le moment.

@timmywil au cours des deux derniers jours, j'ai vraiment rencontré cette idée, basculer entre inside et outside , mais cela semble ne pas fonctionner comme prévu, passant de {contain: outside} à {contain: inside} semble verrouiller l'image dans une position et il semble que les zoomIn() et zoomOut soient liés au paramètre de confinement, donc je ne peux même pas déclencher un zoomOut à moins de le déclencher moi-même. Faites-moi savoir s'il y a des paramètres que j'oublie.

Je suppose que c'est beaucoup de mots pour dire qu'un contain: auto semble exactement ce que je recherche hah

s'il y a un vote pour la fonction automatique, je serai heureux de soutenir cela :)

Cette page vous a été utile?
0 / 5 - 0 notes