Line Chart Types/Scales & Axes/Dual-Axis Line Chart

Dual-Axis Line Chart

Build a dual-axis line chart that plots two metrics with different units or scales on a shared timeline. Use a secondary Y-axis to compare revenue against conversion rate, traffic against price, or volume against percentage without one line flattening the other.

Intermediatedual axis line chartsecondary y axistwo y axestwo scales chart

Example

Guide

Overview

A dual-axis line chart shows two series that share an x-axis (usually time) but live on different value scales. Instead of one Y-axis, you add a secondary Y-axis on the right so each line is measured against its own range. This is the right pattern whenever one metric is in the hundreds and the other is a small percentage — plotting both on a single axis would squash the smaller series into a flat line near zero. For a wider tour of when each pattern fits, see our guide to the different types of line graphs.

When to use

  • Compare a volume metric and a rate (revenue vs conversion rate, sessions vs bounce rate)
  • Show price and quantity together (unit price vs units sold)
  • Overlay an absolute value with an index or percentage (sales vs market share)
  • Track a cause and an effect with different units (ad spend vs ROAS)
  • Present two related KPIs in one chart to save space on a dashboard

Not ideal

  • When both series share the same unit and scale — use a multiple series line chart instead
  • When the two scales invite misleading "correlation by alignment" — readers can be fooled by axes tuned to overlap
  • For audiences who scan quickly: two axes always add cognitive load
  • When you have three or more units — the chart becomes hard to read; consider small multiples

Key variations

  • Left value axis + right value axis (the classic combo)
  • Linear primary axis + logarithmic secondary axis for wide-ranging data
  • Different axis colors matched to each line for instant association
  • Synchronized zero baselines vs independent ranges (choose deliberately)

Use cases

  • Marketing: traffic (count) vs conversion rate (%) per month
  • Finance: revenue (currency) vs gross margin (%)
  • E-commerce: orders (count) vs average order value (currency)
  • Product: active users (count) vs retention rate (%)
  • Operations: output (units) vs defect rate (%)

Quick setup in Line Graph Maker

  1. Arrange your data in wide format: the first column is the shared x-axis, then one column per metric. If your source is JSON, convert it to CSV first with our free JSON to CSV converter.
  2. Assign the large-scale metric to the primary (left) axis and the small-scale metric to the secondary (right) axis.
  3. Give each axis a clear name with its unit, e.g. "Revenue (k USD)" and "Conversion Rate (%)".
  4. Color each line to match its axis so readers instantly know which scale to read.

Data (CSV)

month,Revenue,Conversion Rate
Jan,120,1.8
Feb,135,2.0
Mar,128,1.9
Apr,156,2.3
May,171,2.5
Jun,165,2.4
Jul,189,2.8
Aug,204,3.0
Sep,198,2.9
Oct,221,3.2
Nov,243,3.4
Dec,268,3.6

The seriesYAxisIndex map is what makes this chart dual-axis: Revenue is bound to axis 0 (the left axis) and Conversion Rate to axis 1 (the right axis defined by yAxisSecondary). Matching each line's color to its axis keeps the two scales easy to tell apart.

Performance tips

  • Name both axes with their units — a dual-axis chart is unreadable without labels
  • Match line color to axis color (or label) to remove ambiguity
  • Avoid tuning the two ranges just to make the lines cross; that implies a relationship that may not exist
  • Keep it to two metrics; for a third unit, switch to small multiples

FAQ

What is a dual-axis line chart? A dual-axis line chart plots two series on the same x-axis but uses two separate Y-axes — typically one on the left and one on the right — so each metric is measured against its own scale. It is used when two metrics share a timeline but have very different ranges or units.

When should I use two Y-axes instead of one? Use two Y-axes when one series would otherwise be flattened against the other. For example, revenue in the hundreds and a conversion rate of 2–3% cannot be read on the same axis. If both metrics share the same unit and a similar range, a single axis with multiple lines is clearer.

Can a dual-axis chart be misleading? Yes. Because you control each axis range independently, you can make two unrelated lines appear to move together. Avoid cherry-picking axis ranges to force visual overlap, and never imply causation from alignment alone.

How do I label the two axes clearly? Put the unit directly in each axis name (for example "Revenue (k USD)" and "Conversion Rate (%)") and color each line to match its axis. Readers should never have to guess which scale a line belongs to.

What is the difference between a dual-axis chart and a combo chart? A dual-axis line chart uses two line series. A combo chart mixes chart types — most often bars for one metric and a line for another — on two axes. Use a combo when one metric is naturally a magnitude (bars) and the other a trend (line).

How many metrics can I show on a dual-axis chart? Stick to two. Each additional axis multiplies the effort a reader spends mapping lines to scales. For three or more units, small multiples (one mini chart per metric) communicate far more reliably.

Open in Line Graph Maker