Блог

Мне нужно создать предварительный просмотр pdf, который должен отображаться на веб-странице в виде изображения. PDF-файл представляет собой простой отчет, построенный на почти обычном HTML. По сути, у меня была проблема с отображением флажков, теперь я заменил их фотографиями флажков, но проблема остается той же. Вот как я создаю отчет в формате PDF из моего HTML-представления с помощью groovy и grails:

 def html = htmlRenderService.getReport(info)
    ByteArrayOutputStream out = new ByteArrayOutputStream()
    HtmlImageGenerator htmlImageGenerator = new HtmlImageGenerator()
    htmlImageGenerator.loadHtml(html)
    BufferedImage bi = htmlImageGenerator.bufferedImage
    ImageIO.write(bi, "PNG", out)
    byte[] bytes = out.toByteArray()
    String base64bytes = encoder.encodeToString(bytes)
    String src = "data:image/png;base64,"   base64bytes
    out.flush()

def getReport(Info info) {
    return groovyPageRenderer.render(view: REPORT_VIEW,
            model: [info: info])
}
 

Затем я отправляю строку src в свое представление и отображаю ее как: <img src="${src}" alt=""/>

Тогда мой рисунок с флажком выглядит так: <div style="/*style stuff*/ background-image: url(data:image/png;base64,LINK_TO_THE_IMAGE"></div>

В итоге я получил изображение моего отчета в формате PDF, которое довольно хорошо отображалось в виде изображения на моей странице, НО без флажков. Вот изображение одной его части: И вот та же часть, но из PDF-документа, который я визуализировал таким же образом, но только что скачал с моего веб-приложения: Вот пример, в котором я объединил оба параметра (флажок ввода и флажок изображения) и визуализировал его как изображение:Итак, что может вызвать эту проблему? Заранее благодарю.

ОБНОВЛЕНИЕ: сегодня я наткнулся на этот комментарий в рамках другой проблемы с HtmlImageGenerator:

HtmlImageGenerator, похоже, использует JEditorPane для рендеринга HTML. Поддержка Swing HTML не распространяется на возможность рендеринга изображений данных. Это может быть возможно, если покопаться в HTMLEditorKit и изменить элемент загрузки изображения для поддержки изображений данных, но тогда вам нужно будет найти способ заставить HtmlImageGenerator использовать измененную панель редактора.

Похоже, что HtmlImageGenerator плохо работает с изображениями внутри HTML-файлов, но до сих пор неясно, почему он также не отображает входные данные флажков.

Не видя кода, который вы получаете после загрузки страницы, проверьте панель инструментов разработчика Chrome, чтобы увидеть, действительно ли изображение правильно загружено на страницу, что скажет вам, что оно, по крайней мере, доступно для использования. Затем проверьте, правильно ли URL-адрес выводится в div в качестве фонового изображения. Если это выглядит правильно и в консоли нет связанных с этим ошибок, скорее всего, это настройка css.

При использовании фоновых изображений ваш контейнер должен содержать содержимое, иначе вам нужно будет указать:

• width
• height
• настройка display
• background-position , и
• background-size

Если вы можете загрузить больше информации, я мог бы быть более конкретным.