Quel est l'intérêt de "meta viewport user-scalable = no" dans l'API Google Maps
J'utilise l'API JavaScript Google Maps V3 et les exemples officiels avez-vous toujours inclus cette balise méta:
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
La plupart des exemples tiers que j'ai vus le font également. Cependant, j’ai écrit un plug-in et un de mes utilisateurs m’a dit que cela l’empêchait de zoomer et dé-zoomer sur son appareil mobile . Je n'ai pas d'appareil mobile à tester et aucune de mes recherches n'a révélé d'informations utiles.
Alors, quel est le point de la balise? Dois-je le laisser dans? Devrais-je essayer de détecter l'agent de navigateur et l'afficher uniquement pour les navigateurs de bureau?
Si vous voulez examiner le plugin, vous pouvez le télécharger , parcourir le code source ou voir un exemple en direct .
Sur de nombreux appareils (tels que l'iPhone), cela empêche l'utilisateur d'utiliser le zoom du navigateur. Si vous avez une carte et que le navigateur effectue le zoom, l’utilisateur verra une grande image pixélisée avec d’énormes étiquettes pixélisées. L'idée est que l'utilisateur utilise le zoom fourni par Google Maps. Pas sûr de toute interaction avec votre plugin, mais c'est pour ça qu'il est fait.
Plus récemment, comme @ehfeng le mentionne dans sa réponse, Chrome pour Android (et peut-être d'autres)) ont tiré parti du fait qu'il n'y a pas de navigateur natif qui effectue un zoom sur Cela leur permet de se débarrasser du délai redouté de 300 ms sur les événements tactiles que prend le navigateur pour attendre de voir si votre simple contact finira par être un double contact. (Pensez "simple clic" et "double-clic".) Cependant, lorsque cette question a été posée à l'origine (en 2011), cela ne s'appliquait à aucun navigateur mobile. Il s'agissait simplement d'ajouter un aspect génial qui est apparu fortuitement plus récemment.
La désactivation de la personnalisation par l’utilisateur (à savoir la possibilité de taper deux fois pour zoomer) permet au navigateur de réduire le délai de clic. Dans les navigateurs tactiles, lorsque l'utilisateur s'attend à un zoom double, le navigateur attend généralement 300 ms avant de déclencher l'événement de clic, en attendant de voir si l'utilisateur tapera deux fois. La désactivation de la personnalisation par l'utilisateur permet au navigateur Chrome de déclencher immédiatement l'événement click, permettant ainsi une meilleure expérience utilisateur.
Depuis Google IO session 2013 https://www.youtube.com/watch?feature=player_embedded&v=DujfpXOKUp8#t=1435s
Mise à jour: ce n'est plus vrai, <meta name="viewport" content="width=device-width"> Suffit pour supprimer le délai de 300 ms
À partir de documentation v (Guide du développeur> Concepts> Développement pour les périphériques mobiles):
Les appareils Android et iOS respectent les
<meta>tag:<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />Ce paramètre spécifie que la carte doit être affichée en plein écran et ne doit pas être redimensionnable par l'utilisateur. Notez que le navigateur Safari de l'iPhone nécessite cette
<meta>tag être inclus dans la page<head>élément.
Vous ne devez pas utiliser la balise méta de la fenêtre d'affichage du tout si votre conception n'est pas sensible. Une mauvaise utilisation de cette balise peut conduire à des mises en page brisées. Vous pouvez lire cet article pour savoir pourquoi vous ne devriez pas utiliser cette balise, à moins que vous ne sachiez ce que vous faites. http://blog.javierusobiaga.com/stop-using-the-viewport-tag-until-you-know-ho
"user-scalable = no" permet également d'éviter l'effet de zoom avant sur les zones de saisie iOS.