# Datetime scatter (Scatter example)

> WestCoast Charts 1.1.5, release, public Core release, on npm. HTML: https://westcoast-charts.com/gallery/scatter/scatter-datetime/ · Index for agents: https://westcoast-charts.com/llms.txt

Incidents over time by severity.

- Chart type: `scatter` (Scatter)
- Collection: Scatter · Scatter
- Raw configuration: https://westcoast-charts.com/gallery-src/scatter/scatter-datetime.js
- Standalone example: https://westcoast-charts.com/embed/samples/wcc/gallery/scatter/scatter-datetime.html

## Setup

```js
import WestCoastCharts from 'west-coast-charts'
```

## Options

```js
const options = {
  chart: {
    height: 380,
    fontFamily: "Inter, Geist, \"IBM Plex Sans\", system-ui, sans-serif",
    type: "scatter",
    zoom: {
      enabled: true,
      type: "xy"
    },
    toolbar: {
      show: false
    }
  },
  series: [
    {
      name: "Minor",
      data: [
        [1769644800000, 49],
        [1772323200000, 45],
        [1774224000000, 45],
        [1776211200000, 77],
        [1768262400000, 33],
        [1776297600000, 16],
        [1776211200000, 105],
        [1775606400000, 96],
        [1770249600000, 8],
        [1771891200000, 78],
        [1774051200000, 30],
        [1769472000000, 80],
        [1770508800000, 19],
        [1771459200000, 17],
        [1773360000000, 77],
        [1773705600000, 38],
        [1770163200000, 11],
        [1769299200000, 14],
        [1777593600000, 99],
        [1771200000000, 116],
        [1772236800000, 90],
        [1767571200000, 54],
        [1769817600000, 102],
        [1777593600000, 63],
        [1775174400000, 117],
        [1770768000000, 25],
        [1768003200000, 68],
        [1771113600000, 74],
        [1770768000000, 79],
        [1773705600000, 43]
      ]
    },
    {
      name: "Major",
      data: [
        [1771891200000, 58],
        [1773360000000, 98],
        [1771286400000, 40],
        [1774310400000, 103],
        [1772755200000, 103],
        [1774742400000, 46],
        [1776297600000, 104],
        [1768003200000, 135],
        [1776384000000, 82],
        [1771632000000, 72],
        [1776816000000, 118],
        [1768348800000, 111],
        [1777075200000, 86],
        [1777161600000, 61],
        [1770854400000, 119],
        [1768176000000, 179],
        [1774396800000, 92],
        [1769644800000, 135],
        [1776297600000, 10],
        [1775174400000, 103],
        [1769126400000, 56],
        [1771113600000, 145]
      ]
    },
    {
      name: "Critical",
      data: [
        [1777075200000, 192],
        [1768780800000, 172],
        [1773100800000, 134],
        [1777593600000, 217],
        [1771718400000, 187],
        [1772150400000, 74],
        [1770249600000, 38],
        [1775088000000, 132],
        [1769558400000, 93],
        [1769558400000, 42],
        [1773964800000, 61],
        [1772150400000, 238],
        [1774656000000, 33],
        [1776124800000, 219]
      ]
    }
  ],
  xaxis: {
    type: "datetime"
  },
  yaxis: {
    title: {
      text: "Minutes to resolve"
    }
  },
  markers: {
    size: 5
  },
  title: {
    text: "Incidents by resolution time"
  },
  theme: {
    mode: "light",
    preset: "coastal"
  }
}

const chart = new WestCoastCharts(document.querySelector('#chart'), options)
await chart.render()
```

## Verify

- Text check (Library 1.1.5): load `west-coast-charts/agent/describe` and call `chart.describe({ format: "json" })` for the actual drawn state. The live reader is on this example’s HTML page.
- Command line (Public agent tools 0.2.3, tested with Library 1.1.5; available from the versioned GitHub release and npm, https://westcoast-charts.com/docs/cli/index.md): `wcc chart export scatter-scatter-datetime.json --out scatter-scatter-datetime.svg --with-table` (save the options above as JSON first)