chartletv0.1.0-alpha.3

← All examples

Quarterly change

Positive and negative change, formatted as percent, with a deliberately long label. Build-time warnings: warning[text_truncated] at /data/2/label: text was shortened in the visual chart; the full value remains in the specification and HTML data alternative

Quarterly change

examples/quarterly-change.json
{
  "schemaVersion": 1,
  "type": "bar",
  "orientation": "horizontal",
  "title": "Quarterly change",
  "source": "Example data",
  "categoryAxis": {
    "title": "Quarter"
  },
  "valueAxis": {
    "title": "Change",
    "format": "percent"
  },
  "data": [
    {
      "label": "First quarter",
      "value": 0.12
    },
    {
      "label": "Second quarter",
      "value": -0.04
    },
    {
      "label": "Third quarter with a deliberately long label",
      "value": 0.08
    },
    {
      "label": "Fourth quarter",
      "value": 0.15
    }
  ]
}
Quarterly change
Quarterly changeBar chart with 4 categories. Highest: 15% (Fourth quarter). Lowest: -4% (Second quarter).Quarterly change-5%0%5%10%15%ChangeQuarterFirst quarter: 12%12%First quarterSecond quarter: -4%-4%Second quarterThird quarter with a deliberately long label: 8%8%Third quarter with a deliber…Fourth quarter: 15%15%Fourth quarter

Source: Example data

Show chart data
Data for Quarterly change
CategoryValue
First quarter12%
Second quarter-4%
Third quarter with a deliberately long label8%
Fourth quarter15%
  • Bar (horizontal)
  • Show change and deviation