Converter HTML em imagem

fundo

O lote converte vários arquivos de origem destacados em sintaxe (C, SQL, Java, PHP, lote, bash) em imagens de alta resolução (600 dpi), adequadas para um eBook e livro impresso.

Soluções com falha

Até agora, várias tentativas:

• OpenOffice ou LibreOffice - É necessário reimportar o código fonte no documento toda vez que o arquivo fonte for alterado. (Ou seja, a solução não pode ser facilmente automatizada para centenas ou milhares de arquivos de origem.)
• enscript. Não é possível alterar facilmente as cores, renderiza imperfeitamente a saída, não é abrangente.
• LyX / LaTeX. Renderiza imperfeitamente a saída.
• gvim para HTML - HTMLDOC para PostScript - GhostScript para PNG. HTMLDOC ignora fonttags.
• gvim para HTML - html2ps - GhostScript para PNG. As cores RGB não são reconhecidas por html2ps.
• Firefox para PostScript - GhostScript para PNG. Obnoxiously tortuoso.
• gvim para HTML - OmniFormat para qualquer coisa. Versão gratuita inadequada para processamento em lote; muitos pop-ups de publicidade.
• pigmentos. Não é possível alterar facilmente a resolução da imagem; não possui a variedade de esquemas de cores do gvim.

Solução mais próxima

A solução que quase funciona é:

• gvim para HTML - wkhtmltopdf para PDF. Exigirá pós-processamento com o ImageMagick ( wkhtmltoimage não pode definir a resolução da imagem, apenas a largura da página).

Exigências

• Windows e Linux, mas qualquer um é aceitável.
• Grátis ou OSS
• Somente linha de comando (adequada para processamento em lote)
• Mude facilmente o esquema de cores
• Suporte: PHP, lote, bash, Java, JavaScript, R, C e SQL

Questão

Existem outras maneiras de converter o código-fonte destacado em sintaxe em uma imagem de alta resolução (600 dpi)?

Obrigado!

Requisitos de Software

Os seguintes pacotes de software estão disponíveis para sistemas Windows e Linux e são necessários para uma solução completa e funcional:

• gvim - Usado para exportar o código-fonte destacado da sintaxe para HTML.
• moria - Esquema de cores para realçar a sintaxe.
• wkhtmltoimage - Usado para converter documentos HTML em arquivos PNG.
• gawk e sed - Ferramentas de processamento de texto.
• ImageMagick - Usado para aparar o PNG e adicionar uma borda.

Etapas gerais

Aqui está como a solução funciona:

1. Carregue o código-fonte em um editor que possa adicionar salpicos de cores.
2. Exporte o código-fonte como um documento HTML (com FONTtags incorporadas ).
3. Retire o atributo de plano de fundo do documento HTML (para permitir transparência).
4. Converta o documento HTML em um arquivo PNG.
5. Apare a borda PNG.
6. Adicione uma borda pequena de 25 pixels ao redor da imagem.
7. Exclua arquivos temporários.

O script gera imagens com a mesma largura para arquivos de origem que contêm linhas com menos de 80 caracteres. Os arquivos de origem com linhas com mais de 80 caracteres resultam em imagens com a largura necessária para manter toda a linha.

Instalação

Instale os componentes nos seguintes locais:

• gvim -C:\Program Files\Vim
• moria -C:\Program Files\Vim\vim73\colors
• wkhtmltoimage -C:\Program Files\wkhtml
• ImageMagick -C:\Program Files\ImageMagick
• Gawk e Sed -C:\Program Files\GnuWin32

Nota: O ImageMagick possui um programa chamado convert.exe, que não pode substituir o convertcomando do Windows . Por esse motivo, o caminho completo para convert.exedeve ser codificado no arquivo em lotes (em vez de adicionar o ImageMagick ao PATH).

variáveis ​​ambientais

Defina a variável de ambiente PATH para:

"C:\Program Files\Vim\vim73";"C:\Program Files\wkhtml";"C:\Program Files\GnuWin32\bin"

Arquivo em lote

Execute-o usando:

src2png.bat src2png.bat

Crie um arquivo em lotes chamado src2png.bat, copiando o seguinte conteúdo:

@ECHO OFF

SET NUMBERS=-c "set number"
IF "%2" == "" SET NUMBERS=

ECHO Converting %1 to %1.html...
gvim -e %1 -c "set nobackup" %NUMBERS% -c ":colorscheme moria" ^
  -c :TOhtml -c wq -c :q

REM Remove all background-color occurrences (without being self-referential)
sed -i "s/background-color: #......; \(.*\)}$/\1 }/g" %1.html

ECHO Converting %1.html to %1.png...
wkhtmltoimage --format png --transparent --minimum-font-size 80 ^
  --quality 100 --width 3600 ^
  %1.html %1.png

move %1.png %1.orig.png

REM If the text file has lines that exceed 80 characters, don't crop the
REM resulting image. (The book automatically shrinks large images to fit.)
REM The 3950 is the 80 point font at 80 characters with padding for line
REM numbers.
SET LENGTH=0
FOR /F %%l IN ('gawk ^
  "BEGIN {x=0} {if( length($0)>x ) x=length()} END {print x;}" %1') ^
DO (
  SET LENGTH=%%l
)
SET EXTENT=-extent 3950x
IF %LENGTH% GTR 80 SET EXTENT=

REM Trim the image height, then extend the width for 80 columns, if needed.
REM The result is that all images will be resized the same amount, thus
REM making the font size the same maximum for all source listings. Source
REM files beyond the 80 character limit will be scaled as necessary.
ECHO Trimming %1.png...
"C:\programs\ImageMagick\convert.exe" -format png %1.orig.png ^
  -density 150x150 ^
  -background none -antialias -trim +repage ^
  %EXTENT% ^
  -bordercolor none -border 25 ^
  %1.png

ECHO Removing old files...
IF EXIST %1.orig.png DEL /q %1.orig.png
IF EXIST %1.html DEL /q %1.html
IF EXIST sed*. DEL /q sed*.

Melhorias e otimizações são bem-vindas.

Nota: A versão mais recente do wkhtmltoimage manipula corretamente a substituição da cor do plano de fundo. Portanto, a linha para remover o CSS para cores de segundo plano não é mais necessária, em teoria.

lendo a página de manual de wkhtmltoimage:

 -d,    --dpi   <dpi>   Change the dpi explicitly

se isso não ajudar: a criação de uma solução simples com o Qt e o Webkit (incluído) é bastante direta.

Você também pode usar a linha de comando do Open Office para Html-> PDF:

http://www.oooninja.com/2008/02/batch-command-line-file-conversion-with.html