Skip to content
Apexify.jsDocs
Apexify.js version v5.4.5

Build a multi-file chart report

Executable example · integration

Build a multi-file chart report

Use a typed data module plus ApexPainter to generate both a report chart and exact JSON summary.

✓ VerifiedRuntime: nodeapexify.js

Prerequisites

  • Node.js 22, 24, or 26
  • apexify.js 6.0.0

Authoritative source

SOURCEtypescript
typescript
Studio
import { mkdir, writeFile } from 'node:fs/promises';import { join } from 'node:path';import { ApexPainter } from 'apexify.js';import { reportEntries } from './report-data.js'; const outputDir = process.env.APEXIFY_EXAMPLE_OUTPUT_DIR;if (!outputDir) throw new Error('APEXIFY_EXAMPLE_OUTPUT_DIR is required.'); const painter = new ApexPainter({ type: 'buffer' });const chartData = reportEntries.map((entry, index) => ({  label: entry.label,  value: entry.value,  xStart: index,  xEnd: index + 1,  color: entry.color,}));const png = await painter.createChart('bar', chartData, { dimensions: { width: 640, height: 360 } });const highest = [...reportEntries].sort((a, b) => b.value - a.value)[0]?.label ?? '';const summary = { total: reportEntries.reduce((sum, entry) => sum + entry.value, 0), highest, entries: reportEntries.length }; await mkdir(outputDir, { recursive: true });await writeFile(join(outputDir, 'report.png'), png);await writeFile(join(outputDir, 'summary.json'), `${JSON.stringify(summary, null, 2)}\n`);console.log(JSON.stringify({ example: 'node.integration.report', outputs: ['report.png', 'summary.json'], summary }));

Source hash: e319c93d86cacdf025a04d5601b3c523e710962d96d83e8eac564f8b8c97e52b. The displayed payload is generated from the files executed by DOC-5 verification.

Verified output · report.png
Build a multi-file chart report verified output
640 × 360 · metadata verification

Goal

Prove a realistic multi-file example that produces more than one independently validated output.

Important options

  • bar chart data
  • dimensions

Why these choices

  • Data lives in a separate typed module to prove multi-file fixture copying.
  • The PNG uses metadata verification while the JSON summary uses exact semantic verification.

Variants

  • Replace the report data module with application data while retaining the same rendering boundary.

Performance note

The fixture creates one 640×360 chart and one tiny JSON file; no remote resources are loaded.

Error note

Type errors in the imported data module fail before execution; output contract mismatches fail after execution.

Related documentation

Related API

Next steps

Link the same stable example identity from feature guides and API reference metadata.

Next steps