Text

Text attributes are string attributes that have mostly uniquely different values, such as names or locations.

Statistics

LineUp-lite computes the following statistics for a text attribute:

export interface ITextStats extends ICommonStats {
  /**
   * number of unique text items
   */
  readonly unique: number;
  /**
   * top 10 most frequent text items sorted descending by count
   */
  readonly mostFrequent: readonly { value: string; count: number }[];
  /**
   * converts a given string to a label
   */
  format: (v: string) => string;
}

see ITextStats API Docs

Generator Function

The stats generator function has the following signature. It returns a function that can be used to compute statistics for a given array.

export function textStatsGenerator(options: TextStatsOptions = {}): (arr: readonly string[]) => ITextStats;

see textStatsGenerator API Docs

Example

Live Editor

// import { textStatsGenerator } from '@lineup-lite/components'; function Example() { const compute = textStatsGenerator(); const data = ['a', 'a', 'a', 'b', 'c', 'e', 'f', 'g', 'g', 'h', 'j']; const stats = compute(data); return <pre>{JSON.stringify(stats, null, 2)}</pre>; }

// import { textStatsGenerator } from '@lineup-lite/components';

function Example() {
  const compute = textStatsGenerator();
  const data = ['a', 'a', 'a', 'b', 'c', 'e', 'f', 'g', 'g', 'h', 'j'];
  const stats = compute(data);

  return <pre>{JSON.stringify(stats, null, 2)}</pre>;
}

Result

{
  "unique": 8,
  "items": [
    "a",
    "a",
    "a",
    "b",
    "c",
    "e",
    "f",
    "g",
    "g",
    "h",
    "j"
  ],
  "mostFrequent": [
    {
      "value": "a",
      "count": 3
    },
    {
      "value": "g",
      "count": 2
    },
    {
      "value": "b",
      "count": 1
    },
    {
      "value": "c",
      "count": 1
    },
    {
      "value": "e",
      "count": 1
    },
    {
      "value": "f",
      "count": 1
    },
    {
      "value": "h",
      "count": 1
    },
    {
      "value": "j",
      "count": 1
    }
  ],
  "missing": 0,
  "count": 11,
  "flatCount": 11,
  "flatItems": [
    "a",
    "a",
    "a",
    "b",
    "c",
    "e",
    "f",
    "g",
    "g",
    "h",
    "j"
  ],
  "depth": 1,
  "flatMissing": 0
}

Visualization

Cell

TextLabel React component

Live Editor

// import { textStatsGenerator, TextLabel } from '@lineup-lite/components'; function Example() { const compute = textStatsGenerator(); const data = ['a', 'a', 'a', 'b', 'c', 'e', 'f', 'g', 'g', 'h', 'j']; const stats = compute(data); return <TextLabel value="a" format={stats.format} />; }

// import { textStatsGenerator, TextLabel } from '@lineup-lite/components';

function Example() {
  const compute = textStatsGenerator();
  const data = ['a', 'a', 'a', 'b', 'c', 'e', 'f', 'g', 'g', 'h', 'j'];
  const stats = compute(data);

  return <TextLabel value="a" format={stats.format} />;
}

Result

a

Aggregation

Histogram React component

Live Editor

// import { textStatsGenerator, TextSummary } from '@lineup-lite/components'; function Example() { const compute = textStatsGenerator(); const data = ['a', 'a', 'a', 'b', 'c', 'e', 'f', 'g', 'g', 'h', 'j']; const stats = compute(data); return <TextSummary s={stats} />; }

// import { textStatsGenerator, TextSummary } from '@lineup-lite/components';

function Example() {
  const compute = textStatsGenerator();
  const data = ['a', 'a', 'a', 'b', 'c', 'e', 'f', 'g', 'g', 'h', 'j'];
  const stats = compute(data);

  return <TextSummary s={stats} />;
}

Result

11 items8 unique

Interactive Summary

TextSummary React component

Live Editor

// import { textStatsGenerator, FilterTextSummary } from '@lineup-lite/components'; function Example() { const compute = textStatsGenerator(); const data = ['a', 'a', 'a', 'b', 'c', 'e', 'f', 'g', 'g', 'h', 'j']; const stats = compute(data); const [filterValue, setFilter] = React.useState(null); const filtered = filterValue ? data.filter((d) => d.startsWith(filterValue)) : data; const filteredStats = compute(filtered); return ( <FilterTextSummary s={filteredStats} preFilter={stats} filterValue={filterValue} setFilter={setFilter} summary /> ); }

// import { textStatsGenerator, FilterTextSummary } from '@lineup-lite/components';

function Example() {
  const compute = textStatsGenerator();
  const data = ['a', 'a', 'a', 'b', 'c', 'e', 'f', 'g', 'g', 'h', 'j'];
  const stats = compute(data);

  const [filterValue, setFilter] = React.useState(null);
  const filtered = filterValue ? data.filter((d) => d.startsWith(filterValue)) : data;
  const filteredStats = compute(filtered);

  return (
    <FilterTextSummary s={filteredStats} preFilter={stats} filterValue={filterValue} setFilter={setFilter} summary />
  );
}

Result