Pdf.js: Utilice un zoom más natural en el móvil

Creado en 18 ene. 2013  ·  95Comentarios  ·  Fuente: mozilla/pdf.js

En este momento, debe presionar los botones más / menos incluso en el dispositivo móvil para hacer zoom en el documento. Esto es realmente extraño, especialmente porque la función de pellizcar para hacer zoom también está activa. Creo que la mejor manera de hacerlo en un dispositivo móvil es quizás renderizar a un tamaño "natural" y dejar que el navegador controle el zoom, similar a una página web.

1-viewer 2-feature

Comentario más útil

@ltullman @ hetalv985 Logré hacer que funcionara, implementarlo yo mismo, verifique mi esencia aquí:

https://gist.github.com/squallstar/1d720e93eabe7f60dc61b547d2c19228
simplemente péguelo al final de viewer.html 👍 eso es todo.

Todos 95 comentarios

Esto es lo que queríamos hacer, pero para V1, el pellizco para hacer zoom tenía problemas, así que tuvimos que usar los botones de zoom.

¿Puede dar más detalles sobre los problemas? Creo que probablemente podríamos priorizarlos para que PDF.js funcione bien.

Realmente no creo que quieras que el navegador haga zoom en este caso. Si pdf.js procesa un documento a 800x600, y pellizcas el zoom, el navegador continuará procesando ese contenido de 800x600 a una nueva resolución más alta que puede o no parecer una mierda dependiendo de la resolución del dispositivo y cómo mucho has ampliado. (¿Supongo que pdf.js todavía usa lienzo para renderizar y no svg?)

@brendandahl Definitivamente lo pondré en mi lista de tareas pendientes y comenzaré a experimentar con él pronto. https://github.com/mozilla-b2g/gaia/blob/862de8489b648a9af7e8a5b88be031b5479404ba/apps/camera/js/panzoom.js#L15 parece tener un buen ejemplo, ya que 'transform' se usa para eventos de pellizco de 2 dedos. Sería genial si pellizcar para hacer zoom funcionara, ya que se usa con bastante frecuencia en dispositivos móviles.

Estoy trabajando en esto. Los usuarios interesados ​​pueden estar atentos a https://github.com/timvandermeij/pdf.js/tree/pinch-to-zoom para ver el progreso. Ya está detectando el comando de pellizcar para hacer zoom en mi tableta y teléfono, pero se debe mejorar la precisión, así como la reproducción real (tendré que encontrar una manera de calcular la nueva escala con la escala anterior y el nuevo punto medio, o de alguna otra manera).

@timvandermeij Una cosa que quizás debamos hacer antes de implementar esto es mejorar el zoom. Hemos hablado primero de usar transformaciones css para escalar el lienzo, luego comenzar a renderizar y luego, una vez que se realiza la renderización, mostrar el nuevo lienzo.

Creo firmemente que la mejor solución aquí será una que dependa del compositor del navegador para hacer el zoom transitorio (la animación durante el pellizco o doble toque) y luego dejar que pdf.js se vuelva a dibujar con la nueva resolución. La parte triste aquí es que en este momento el contenido no tiene en cuenta los cambios de zoom, y no creo que el cambio de tamaño del lienzo a la nueva resolución funcione. Es posible que necesitemos mejorar la especificación del lienzo para manejar esto.

Tuve cierto éxito con hammer.js. Permití el pellizco "nativo" del navegador (que conduce a PDF borroso) y al pellizcar, redibujo el lienzo del PDF, con scale = scale * zoom y le doy al lienzo el css "transform: scale (1 / zoom)". Entonces todos estarán en el mismo lugar (especialmente el texto y los anclajes). Se ve bien.

@skruse Hace un tiempo preparé un parche para implementar pellizcar para hacer zoom (ver # 3708), también con Hammer.js, pero aún no he logrado que funcione correctamente en dispositivos móviles / tabletas. Los movimientos de pellizco causaron muchos problemas de rendimiento y estabilidad. ¿Le importaría compartir su implementación con nosotros? Si no es así, ¿podría crear una solicitud de extracción con su implementación de pellizcar para ampliar? Quizás podría reemplazar al mío si funciona con más fluidez en dispositivos móviles / tabletas. :)

Hola skruse, ¿cómo pudiste calcular la relación de zoom al final del zoom?

var zoom = document.documentElement.clientWidth / window.innerWidth;

Y también tengo problemas de rendimiento: no se debe acercar "demasiado" en un dispositivo móvil, en términos del parámetro de "escala". Supongo que 2 o 3 es el máximo.

+2 por esto

¿Alguien tiene una solución para este problema de hace 2 años?

Hasta donde yo sé, no se ha hecho nada al respecto. Me refiero a mi comentario anterior en https://github.com/mozilla/pdf.js/issues/2582#issuecomment -30316908. Invitamos a cualquiera a enviar un PR para esto una vez que haya un código de trabajo.

Me encantaría ver una solución para esto. Por el momento, esto es lo único que me impide usar pdf.js

:(

¡Pellizcar el zoom sería genial! Encontré este complemento de jquery que usa pdf.js y tiene pellizcar zoom y deslizar páginas. http://touchpdf.net/demo/index.htm Pero sería bueno si estuviera construido en pdf.js desde el principio :-)

+1 Me encantaría ver esto aquí.

+1, ¿el ejemplo en otro lugar que usa hammer.js para capturar el evento y luego llamar a las funciones de zoom pdf.js no sería un método relativamente "limpio"?

@sporkman, lo que hice al final fue hacer que el lienzo fuera realmente grande y luego usar el zoom nativo del navegador para permitir el zoom (mi aplicación fue diseñada para dispositivos táctiles). puedo compartir la fuente si es necesario.

@rorysmorris, ¿cómo se las arregló para evitar la desactivación del zoom nativo del navegador al pellizcar mientras se desplaza? También he implementado hammer.js en pdf.js pero no puedo solucionar ese problema en particular

¿Ha intentado utilizar la propiedad touch-action CSS?
https://developer.mozilla.org/en-US/docs/Web/CSS/touch-action

El 5 de octubre de 2016 a las 15:15, "toplay3" [email protected] escribió:

@rorysmorris https://github.com/rorysmorris ¿cómo te las arreglaste para conseguir
por deshabilitar el zoom nativo del navegador al pellizcar mientras se desplaza? yo tengo
también implementó hammer.js en pdf.js pero no puedo evitar ese particular
problema

-
Estás recibiendo esto porque estás suscrito a este hilo.
Responda a este correo electrónico directamente, véalo en GitHub
https://github.com/mozilla/pdf.js/issues/2582#issuecomment -251670785,
o silenciar el hilo
https://github.com/notifications/unsubscribe-auth/ABTUT83E287dv4LSs4T_TGnzwe8yqCMYks5qw6LmgaJpZM4AXvZ2
.

@ Rob - W
wow genio! funciona perfectamente ahora! ¡muchas gracias!

¿Cuándo se planea implementar este tema? Ha pasado bastante tiempo desde que se publicó originalmente este problema. ¡No hace falta decir +1!

También reviso este problema todas las semanas desde hace un año. Sería genial tenerlo en core o como complemento con hammer js.

Para ser más constructivo en este hilo, aquí están los requisitos para la interfaz de usuario (si alguien realmente quiere ayudar y acelerar la resolución del problema) y no hay nada específico para PDF.js:

  • para ampliar y desplazar un conjunto de DIV (con diferentes tamaños) que se apilan verticalmente
  • no permitir que el usuario se pierda en la ventana gráfica a diferentes escalas
  • detectar e informar cuando cambia la visibilidad de un div o la escala visible.

Esto último es importante ya que no queremos pintar todas las páginas a la resolución máxima en dispositivos de baja potencia. Si alguien va a tener un prototipo, búscame en el IRC. Te ayudaré a conectar PDFPageView para obtener visibilidad y escalar eventos. ¿Debo establecer también 5-good-beginner-bug?

Estoy de acuerdo en que este sería un buen error para principiantes, así que lo etiqueto como tal.

Esto no es solo para dispositivos móviles, también recibo solicitudes de funciones para admitir el zoom del trackpad con dos dedos (en Mac).

A partir de mi breve investigación, descubrí que todavía no existe una forma de varios navegadores para admitir gestos de zoom.

+1

@ toplay3 y @ Rob - W ¿Qué hiciste para que funcionara? ¿Agregar "acción táctil: auto;"? ¿A qué? Y que mas hiciste ¡Gracias!

Hola a todos, como la mayoría de ustedes, estoy interesado en hacer funcionar el pellizco para hacer zoom, ¿alguien ha podido hacerlo, incluso usando bibliotecas externas como hammer? Si lo lograste, ¿cuál es la configuración? @rorysmorris @ toplay3 @ Rob - W gracias

👍

@rorysmorris ¿ algún consejo sobre la pregunta anterior? Gracias :)

Hola @squallstar : al principio intenté usar una biblioteca JS pellizcar y hacer zoom para manejar esto por mí, pero encontré algunos problemas. No hizo zoom como quería, es decir, permitiría que el lienzo del PDF se fuera completamente de la pantalla, cuando nunca quise que los bordes estuvieran alejados del borde de la pantalla, si eso tiene sentido. Al final, solo utilicé el zoom nativo que está integrado en el navegador móvil para pellizcar / hacer zoom / navegar. Configuré PDF.js para representar el PDF a 3 veces el tamaño de píxel que se estaba mostrando, luego lo reduje con CSS, por lo que permanecería bastante nítido cuando se amplía. Si necesita ayuda, podría mostrarle un ejemplo práctico de mi implementación.

@rorysmorris gracias, sería genial si me mostraras (o me mandas un fragmento) o cómo lo implementaste. Muy apreciado 👍

@squallstar envíeme un correo electrónico a través del formulario de contacto en mi sitio y recibiré una demostración más tarde hoy :) http://rorymorris.co.uk

@squallstar Esto no es realmente una solución, sino una especie de solución. Las desventajas son: Rendimiento, el resultado depende de los dispositivos, el zoom no es infinito.

El rendimiento mejora enormemente mediante el desplazamiento y la panorámica nativos, en lugar de utilizar JavaScript para realizar esas tareas. El nivel de zoom máximo se puede configurar fácilmente con una metaetiqueta de ventana gráfica y, de todos modos, ¿quién quiere un zoom infinito en una imagen rasterizada? ¡Por cierto, una biblioteca "JS-ImageResizer" de gran apariencia! @MickL

El rendimiento fue más una suposición. Digamos que usa un iPhone Plus en horizontal @ 2208px de ancho. Ahora tendrías un Canvas de 6624px. Dependiendo de la complejidad del PDF y la cantidad de páginas, puede tener 3 Lienzos de 6000px renderizados con texto HTML, gráficos, etc.

Supongo que su solución es excelente para mucha gente. Pero como describiste, es más un zoom falso de lo que realmente activa el zoom y la reproducción de PDF.js :)

Es cierto que el rendimiento desde ese aspecto no es genial. En mi caso de uso particular para esto, tuve que renderizar PDF de más de 300 páginas en el tamaño de iPad (retina), ¡así como tener un lienzo de dibujo encima de cada uno!

PDF.js bloquearía el navegador (iOS Safari) en alrededor de 10 páginas PDF renderizadas, por lo que al final solo tuve que mostrar una página PDF a la vez con los botones anterior / siguiente. ¡No es ideal! Y estoy de acuerdo, la funcionalidad de zoom nativa integrada en PDF.js habría sido mucho mejor.

checkout kamihq.com para trabajar con un ejemplo de zoom de pellizco

@rorysmorris Te envié mi correo ayer por la tarde a través del formulario de contacto, ¿alguna posibilidad de que me envíes el ejemplo del que hablabas? :) Gracias

¿Alguien que tenga un ejemplo funcional ( @rorysmorris , @ Rob - W, etc.) puede compartirlo?

@rorysmorris Traté de contactarlo a través de su sitio web. Si alguien tiene un ejemplo práctico de esto, ¿puede compartirlo?

@ltullman @ hetalv985 Logré hacer que funcionara, implementarlo yo mismo, verifique mi esencia aquí:

https://gist.github.com/squallstar/1d720e93eabe7f60dc61b547d2c19228
simplemente péguelo al final de viewer.html 👍 eso es todo.

Gracias squallstar. Pero no estamos usando viewer.html. Estamos renderizando el pdf en nuestra aplicación móvil iOS dentro de una etiqueta div. ¿Cómo usamos esta función en ese caso? ¿Necesitamos incluir los archivos del visor?

Entonces tenemos la función handleMouseWheel que es muy similar. ¿Por qué no utilizar exactamente la misma función con el gesto táctil o el martillo js? ¿No se soluciona esto en 1-2 horas entonces?

Desafortunadamente, no es tan fácil. Consulte mi comentario anterior en https://github.com/mozilla/pdf.js/issues/2582#issuecomment -30316908. Necesitamos limitar la cantidad de gestos táctiles para que el lienzo no se vuelva a representar en cada cambio delta, que es un problema de rendimiento importante. Si alguien está dispuesto a trabajar en esto, no dude en enviar un PR y lo revisaremos.

Si ese es el único problema ... :)

También noté que en "ctrl + mousewheel" se desplaza a la posición del cursor como en Google Maps. Pero esto no funcionará si no hay barras de desplazamiento (que es la predeterminada en la carga de la página). Entonces, para que esto se sienta natural, tenemos que crear un relleno si es necesario para hacer zoom con pellizco y zoom con rueda del mouse.

Una buena adición sería si el zoom con rueda del mouse y el zoom con pellizco usaran la misma función.

Tu compromiso ya se ve bien. Tal vez el rendimiento ya no sea un problema, fue hace más de 3 años. Por supuesto, la mejor solución sería: iniciar-pellizcar -> zoom borroso -> fin-pellizcar -> realmente acercar pdf. Además, user-scalable=no ya no funciona en la última versión de iOS. Por tanto, es posible que también tengamos que preventDefault() .

Invertí mucho tiempo en esto. En realidad, parece posible, pero hay varios problemas que no pude resolver:

  • hammer.js solo funciona en pinchend (pinchmove siempre se cancela cuando pdf.js hace zoom)
  • No pude desplazarme perfectamente hasta el centro de pinchend aunque utilicé el mismo método que el zoom con rueda del ratón
  • A veces, el centro no está configurado correctamente por hammer.js
  • A veces, hammer.js no llama a pinchend y no ocurre ningún zoom
  • Traté de agregar la transformación css en pinchmove (css zoom en pinchmove, pdf js zoom en pinchend) lo que daría un gran rendimiento, pero nuevamente no pude desplazarme perfectamente (posición #viewer con css translate)
  • hammer.js evita cualquier otra acción táctil (en nuestro caso, el desplazamiento de página normal), así que tuve que modificar hammer.js para evitarlo solo cuando se usan 2 dedos
  • (Lo mismo para el zoom con la rueda del mouse :) Si no hay barras de desplazamiento (alejadas para ver el documento completo) no podemos colocar (desplazar) el documento al centro del pellizco.

Probablemente todo esto tenga solución, pero iOS 10 permite el zoom de página incluso cuando está deshabilitado con user-scalable=no . Así que un par de veces al pellizcar preventDefault () no funciona y se amplía toda la página. Esto generaría un problema importante para el usuario final (la única forma de salir es presionando dos veces la barra de herramientas).

@MickL Lo intenté. Pude evitar la cancelación de "pellizcar zoom" agregando la propiedad CSS "pointer-events: none" a las clases pdfViewer y page (y llamando a stopPropagation + preventDefault cuando viewerContainer envía eventos de doble toque para que toda la página no se acerque iOS).

Tengo el mismo problema que usted describe de no tener el evento de posición de zoom perfecto cuando utilizo el método modificado de la rueda del mouse (pase la siguiente escala que se aplicará, la "posición media" actual o el objetivo y el delta de la "posición media" para saber cuánto mover hacia la izquierda, derecha, arriba, abajo, administrado por pdfViewer.container.scrollLeft y pdfViewer.container.scrollTop). Parece que siempre hay un error introducido, tal vez por el tiempo de espera, que evita que el espectador renderice en cada evento de doble toque.

¿Alguna pista sobre dónde aplicar esas transformaciones de escala CSS para evitar renderizar todo en cada delta de escala?

@betovidal Sé que han pasado algunos meses desde tu última publicación. ¿Ha realizado alguna actualización sobre cómo hacer que el zoom de pellizco funcione en PDF.js? Estoy trabajando en un proyecto de trabajo que requiere esto.
¿Quizás podríamos trabajar juntos para encontrar algo?

@squallstar Probé su solución en iOS muy brevemente. ¡Y hasta ahora, está funcionando para mí! Gracias por compartir tu solución 💯

@vuinguyen gracias! Me alegro de que también te haya funcionado;)

+1

¿Alguna esperanza de integrar el código de @squallstar en un PR? Actualmente, si un usuario intenta pellizcar y hacer zoom en un dispositivo móvil, a menudo está "bloqueado" y no puede desplazarse y tiene que volver a cargar la página simplemente para navegar más. Confiar en los pequeños botones "+" y "-" para navegar es bastante contrario a la intuición para un espectador móvil en 2018.

El zoom de pellizco está "roto" en iOS desde iOS 10. Incluso si todo se implementa a la perfección, Safari lo arruinará todo.

¿Es este un problema específico de iOS? ¿Es posible hacer zoom en un PDF servido por pdfjs en Android?

Depende del navegador. Supongo que solo los navegadores iOS ignoran "user-scalable = no".

En este momento, debe presionar los botones más / menos incluso en el dispositivo móvil para hacer zoom en el documento. Esto es realmente extraño, especialmente porque la función de pellizcar para hacer zoom también está activa. Creo que la mejor manera de hacerlo en un dispositivo móvil es quizás renderizar a un tamaño "natural" y dejar que el navegador controle el zoom, similar a una página web.

Para mí, esto lo dice todo. Supongo que se trata menos de una función específica y más bien de un enfoque de la experiencia móvil.

Supongo que solo los navegadores iOS ignoran "user-scalable = no".

Correcto.

Vi que "Box Content Preview" (que usa PDFJS para mostrar archivos PDF) tiene una buena implementación para esto. Este es un Codepen de su visor:

https://codepen.io/box-platform/pen/rmZdjm

Y esta es la solicitud de extracción para su corrección:

https://github.com/box/box-content-preview/pull/567

Pensé que tal vez alguien podría hacer algo similar para PDFJS, según su solución. Intentaré implementarlo yo mismo y publicar el código si lo hago. ¡Sería genial si alguien más (que probablemente tenga más experiencia que yo) también pueda colaborar y probarlo!

@ amurillo17 gracias por el enlace. La solución Box tiene un aspecto fantástico. Me encantaría ver algo como esto funcionando con pdfjs. ¡Por favor, mantennos actualizados sobre tu progreso!

¿Existe alguna buena solución para este problema?

¿Alguna actualización para esto? ¡Sería una gran característica tener!

alguna actualización ? Gracias

¿Hay alguna forma sencilla de agregar esta función al visor existente?

¿Hay alguna forma sencilla de agregar esta función al visor existente?

No.

@prohtex Hm, eso es bastante triste. Espero que esta característica se agregue poco después de todos estos años.

@prohtex Hm, eso es bastante triste. Espero que esta característica se agregue poco después de todos estos años.

Solo se agregará cuando alguien integre código en un PR (no yo, lamentablemente), e incluso entonces, podría llevar años.

Tengo una solución, pero es "solo para Android", ya que no me importa iOS en mi complemento "Firefox para Android":
https://github.com/M-Reimer/android-pdf-js/blob/master/patches/pdfjs-pinch-gestures.js
Mi Makefile simplemente agrega esto a "web / viewer.js". Registra los eventos táctiles y traduce los gestos de pellizcar en clics de botones.

Tengo una solución, pero es "solo para Android", ya que no me importa iOS en mi complemento "Firefox para Android":

También funciona en mi iPad, pero se siente un poco lento y no muy natural. Se amplía un paso después de cada pellizco. Entonces tienes que soltar los dedos para hacer zoom y no importa qué tan lejos hayas pellizcado. ¿Es este el comportamiento normal o simplemente un error específico del dispositivo? Gracias de todos modos, porque este es un paso en la dirección correcta.

También funciona en mi iPad, pero se siente un poco lento y no muy natural. Se amplía un paso después de cada pellizco. Entonces tienes que soltar los dedos para hacer zoom y no importa qué tan lejos hayas pellizcado. ¿Es este el comportamiento normal o simplemente un error específico del dispositivo? Gracias de todos modos, porque este es un paso en la dirección correcta.

Mirando el código, esta no es una solución viable o incluso una buena solución. Todo lo que hace es observar los eventos de zoom y simular hacer clic en los botones [-] [+] con jQuery.

@prohtex Exactamente. Si lo intentas, hace algo, pero no funciona nada bien.

Como dije: No perfecto pero mejor que nada.
Al menos para mí, es más fácil hacer el gesto de pellizcar que presionar un pequeño botón de zoom en una pequeña pantalla móvil. Hace que los gestos funcionen que todos los usuarios de dispositivos móviles esperan que funcionen.

También funciona en mi iPad, pero se siente un poco lento y no muy natural. Se amplía un paso después de cada pellizco. Entonces tienes que soltar los dedos para hacer zoom y no importa qué tan lejos hayas pellizcado. ¿Es este el comportamiento normal o simplemente un error específico del dispositivo? Gracias de todos modos, porque este es un paso en la dirección correcta.

Golpea los botones. El "zoom natural" no es posible con este enfoque simple y no quiero ensuciar demasiado con PDF.js. Este no es el objetivo de mi complemento.

Pero debería ser posible presionar varios botones dependiendo de qué tan lejos se hayan movido los dedos. Lo intentaré.

Mirando el código, esta no es una solución viable o incluso una buena solución. Todo lo que hace es observar los eventos de zoom y simular hacer clic en los botones [-] [+] con jQuery.

Estoy abierto a sugerencias, pero como esto es parte de un complemento que solo quiere que PDF.js se pueda usar como visor de PDF dentro de Firefox, no haré modificaciones profundas.

Por cierto: no hay una sola línea de jQuery en mi código. Este es JavaScript sin formato.

Debería ser posible realizar los pasos del zoom mientras se mueven los dedos ...
Intentaré hacer algunas mejoras más, pero la única vía de comunicación que usaré son los dos botones que controlaré a distancia. De esta forma, mi código no interfiere con PDF.js.

Por cierto: no hay una sola línea de jQuery en mi código. Este es JavaScript sin formato.

Me quedo corregido. Esperando una solución madura pronto.

La forma de lograr esto es usando la transformación css mientras pellizca y hace zoom. Además, el movimiento de los dedos debe aplicarse no solo el zoom. Luego, al pellizcar-hacer zoom-end, puede restablecer la transformación css y aplicar el zoom real y desplazarse a pdf.js.

PD: Usar jQuery dentro de un proyecto que no es de jQuery ya me parece una mala práctica.

PD: Usar jQuery dentro de un proyecto que no es de jQuery ya me parece una mala práctica.

¿Dónde usa @ M-Reimer JQuery? Como ya dijo, su solución solo usa Javascript simple.

Sí ... mi mal. El punto es que esta solución no funciona bien.

Actualizado para que la distancia entre los dedos cambie la cantidad de zoom:
https://github.com/M-Reimer/android-pdf-js/blob/master/patches/pdfjs-pinch-gestures.js
No es posible hacer zoom mientras se mueven los dedos ya que, por alguna razón, el zoom real y el redibujo hacen que el evento táctil "finalice" de alguna manera.
Nuevamente: mejor que no manejar el gesto en absoluto.

@ M-Reimer Muchas gracias por su trabajo. Al menos, es una mejora en comparación con la última versión. Tal vez alguien encuentre una solución para volver a dibujarlo mientras hace zoom. O podría ser posible hacer zoom temporalmente usando transformaciones CSS y luego volver a dibujarlo eventualmente después de que finalice el gesto táctil.

@anvaka Estudió el caso y parece que podría haber una solución bastante simple . Desafortunadamente, actualmente no tengo tiempo para probarlo, pero tal vez alguien quiera intentarlo.

Hice una versión basada en la solución @squallstar que también usa la transformación css durante el movimiento de pellizco para brindar más comentarios a los usuarios. El renderizado solo se realiza al tocarlo. No es perfecto, hay algunos pequeños problemas con el posicionamiento del desplazamiento después del renderizado, pero tal vez alguien pueda usarlo como un comienzo.

https://gist.github.com/jsprpalm/12217feab2f1acc14bd8e8508291619e

¿Todavía no hay solución para este problema? Me gustaría usar pdf.js en dispositivos móviles, pero sin la capacidad de hacer zoom, es casi inútil en pantallas más pequeñas.

Lo hice funcionar sin el uso de hammer.js, pero como era para un proyecto de clientes, no puedo compartir el código. Implementé pinch y doubletap y amplié con css y en pinchend amplié pdf.js. Algunos elementos requieren establecer ancho / alto y algunos se pueden transformar con css-transform. Además, al hacer zoom, debe evitarse el reloj de desplazamiento de pdf.js viewer.js. Me tomó mucho tiempo pero funcionó bastante bien al final.

¿Todavía no hay solución para este problema? Me gustaría usar pdf.js en dispositivos móviles, pero sin la capacidad de hacer zoom, es casi inútil en pantallas más pequeñas.

Hasta que un desarrollador tenga experiencia con los pasos de la base de código pdf.js para ofrecer una solución, dependerá de cada persona que implemente pdf.js improvisar algo. No parece ser una gran prioridad para este proyecto.

Aquí hay un PR que podría integrarse sin demasiada dificultad:

https://github.com/box/box-content-preview/pull/567

https://gist.github.com/jsprpalm/12217feab2f1acc14bd8e8508291619e

@jsprpalm gracias, funciona muy bien, necesita una solución, por favor, alguien ayude a solucionarlo

@aidrouge https://gist.github.com/larsneo/bb75616e9426ae589f50e8c8411020f6

Agregué este a mi complemento de visor de PDF. Parece que funciona bastante bien.
https://addons.mozilla.org/android/addon/android-pdf-js/

Editar: funciona para mí

Para mí, trabajando de forma más natural, esto:

<meta
      name="viewport"
      content="width=device-width, initial-scale=1, maximum-scale=10.0, minimum-scale=1.0"
    />

¿Cómo configuro el zoom mínimo? Puedo reducir tanto la imagen que se convierte en un punto.

Tengo la misma pregunta que @KazysNoobiys.
la escala mínima en la ventana gráfica no afecta el zoom

Estoy trabajando en otra solución: una capa CSS transparente que se superpone a pdf.js para manejar varias funciones de deslizamiento. La porción de superposición funciona ahora, pero no sé qué funciones llamar.
si (deslizar == 'izquierda') ????
¿Qué función debo llamar para avanzar a la página siguiente o hacer una copia de seguridad de la página anterior o hacer zoom?

ahorre tiempo y vida, edite su archivo .html como este

// delete the 'maximum-scale'
<meta name="viewport" content="width=device-width, initial-scale=1">

p.ej. https://github.com/mozilla/pdf.js/blob/master/web/viewer.html#L26

¿Fue útil esta página
0 / 5 - 0 calificaciones

Temas relacionados

timvandermeij picture timvandermeij  ·  4Comentarios

smit-modi picture smit-modi  ·  3Comentarios

THausherr picture THausherr  ·  3Comentarios

anggikolo11 picture anggikolo11  ·  3Comentarios

liuzhen2008 picture liuzhen2008  ·  4Comentarios