HTML

Gera HTML com CSS inline que replica o posicionamento do PDF. Gráficos são renderizados com Chart.js 4 (carregado via CDN).

Uso

final htmlBytes = await engine.renderToHtml(context);

// Salvar como arquivo
File('report.html').writeAsBytesSync(htmlBytes);

Layout

O HTML usa o mesmo modelo de posicionamento do PDF:

• Cada band → <div> com position: relative e height fixo
• Cada elemento → position: absolute com left e top em pixels
• A página → <div class="page"> com max-width baseado no formato (595px para A4)
• Margens → padding no container da página

<div class="page" style="max-width:595px; padding:40px;">
  <div class="band" style="height:120px; position:relative;">
    <div style="position:absolute; left:40px; top:40px; font-size:32px; font-weight:bold;">
      INVOICE
    </div>
  </div>
</div>

Paginação

O HtmlRenderer implementa paginação explícita multi-página:

• Cada página tem altura exata (height do pageSettings, não min-height)
• HeaderBand é repetida em todas as páginas na ordem de definição
• SummaryBand é ancorada ao rodapé da última página — equivalente ao comportamento do PDF
• Quebra de página via forcePageBreakBefore: true na band insere uma nova <div class="page">

Gráficos

Gráficos (ChartElement) são renderizados como <canvas> com Chart.js 4. O script é injetado automaticamente via CDN:

<script src="https://cdn.jsdelivr.net/npm/chart.js@4"></script>

Os dados e a configuração do gráfico são inline no HTML. Funciona ao abrir o arquivo em um browser com acesso à internet.

Recursos suportados:

• Barras empilhadas — stacked: true ativa scales.x.stacked e scales.y.stacked no Chart.js (só para tipo bar)
• Barras agrupadas — comportamento padrão com múltiplas séries
• Borda — hasBorder aplica CSS border (sólida ou tracejada) ao container do canvas
• Legenda — posição validada (top, bottom, left, right)
• Paleta de cores — séries sem cor definida usam a paleta padrão de 10 cores; fatias de pizza sempre usam a paleta
• IDs únicos — cada canvas tem ID com contador incremental, evitando colisões em group bands

Print

O HTML inclui estilos @media print otimizados:

• Remove sombras e margens externas
• Aplica margens do pageSettings via @page

O título do relatório não é inserido no output HTML — nenhuma tag <h1> é gerada pelo renderer.

Limitações

• Barcodes dependem de JavaScript no browser (JsBarcode/QRCode.js)
• Fontes customizadas não são aplicadas (usa a fonte do sistema)