CORE

Charts

Shared chart components for docx and pptx — bar, line, pie, area, and scatter charts

@office-open/core provides chart components shared by @office-open/docx and @office-open/pptx. Charts are defined using ChartSpace and managed via ChartCollection.

Chart Types

Type	Class	Description
Bar	`BarChart`	Vertical or horizontal bars
Line	`LineChart`	Line series with optional markers
Pie	`PieChart`	Pie or doughnut chart
Area	`AreaChart`	Filled area series
Scatter	`ScatterChart`	XY scatter plot

ChartSpace

ChartSpace is the root element for a chart. It wraps the chart type, title, axes, and data.

import { ChartSpace, BarChart } from "@office-open/core";

const chart = new ChartSpace({
    title: { text: "Revenue" },
    chartType: {
        type: BarChart,
        data: {
            categories: ["Q1", "Q2", "Q3", "Q4"],
            series: [{ name: "2024", values: [10, 20, 30, 40] }],
        },
    },
});

ChartCollection

ChartCollection manages multiple charts within a document or presentation:

import { ChartCollection } from "@office-open/core";

const charts = new ChartCollection();
charts.add(chart);

Chart Title

import { ChartTitle } from "@office-open/core";

const title = new ChartTitle("Sales Report");

Series Data

Each chart type accepts SeriesData with categories and series values:

const data = {
    categories: ["Jan", "Feb", "Mar"],
    series: [
        { name: "Product A", values: [10, 20, 15] },
        { name: "Product B", values: [5, 12, 8] },
    ],
};

Axes

Charts that use axes (bar, line, area, scatter) support axis configuration:

import { CatAx, ValAx } from "@office-open/core";

// Category axis and value axis are created automatically
// based on chart type options

Usage in Documents

Charts are typically created through the document/presentation API rather than directly. See:

DOCX Charts for Word chart integration
PPTX Charts for PowerPoint chart integration

Edit this pageorReport an issue