Gallery / Points & scatter

point

Scatter coloured by discrete group

Discrete hue when categories are unordered and equal visual weight matters.

Scatter coloured by discrete group

Source

Svelte, builder, JSON

<script lang="ts">
  import {
    GeomPoint,
    GGPlot,
    Inspect,
    Labs,
    ScaleColorHue,
    ThemeMinimal,
  } from "@ggts-sh/svelte";

  import { armadaSquadrons } from "./data.js";
</script>

<GGPlot
  data={armadaSquadrons}
  aes={{ x: "ships", y: "men", color: "squadron" }}
  width={640}
  height={400}
>
  <GeomPoint size={5} />
  <ScaleColorHue />
  <ThemeMinimal />
  <Labs
    title="Scatter coloured by discrete group"
    subtitle="Ten squadrons by ships and men"
    x="Ships"
    y="Soldiers and sailors"
    color="Squadron"
  />
  <Inspect mode="xy" pin maxDistance={24} />
</GGPlot>

Meta

Details

Family
Points & scatter
Source
point/hue-discrete
Rendering
SVG
Techniques

point · color · hue · discrete · scale