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
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 sinonoutside
suppose que l'image doit AU MOINS occuper la totalité de la fenêtreoù 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 :)
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
etoutside
inside
suppose que l'image est suffisamment petite pour tenir dans la fenêtre et a des effets étranges sinonoutside
suppose que l'image doit AU MOINS occuper la totalité de la fenêtreoù 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