Skip to content

Sparkier/Missing-Coordinates

Repository files navigation

Current build status Current NPM version

Missing Coordinates

Teaser Image

Implementation of a novel extension to Parallel Coordinates, introduced in the Paper:

Where did my Lines go? Visualizing Missing Data in Parallel Coordinates

presented at EuroVis 2022. Created by Alex Bäuerle, Christian van Onzenoodt, Simon der Kinderen, Jimmy Johansson Westberg, Daniel Jönsson, and Timo Ropinski.

Demo

For a demo of missing-coordinates, check out our storybook example.

Usage

First install:

npm install --save missing-coordinates

Using our Parallel Coordinates implementation is as simple as:

Plain JS

script.js

import { PC } from "./node_modules/missing-coordinates/dist/index.mjs";
// if you are using a bundler, this would be import { PC } from "missing-coordinates";

new PC({
  target: document.body,
  props: {
    data: {
      name: "sample",
      axes: [
        { name: "A", data: ["A", "A", "A", "A", "B", "B"] },
        { name: "B", data: [0.0, null, 0.4, null, 0.8, 1.0] },
        { name: "C", data: [0.0, 0.2, 0.4, 0.6, 0.8, 1.0] },
      ],
    },
  },
});

index.html

<!DOCTYPE html>
<html lang="en">
  <style></style>
  <body>
    <script src="script.js" type="module"></script>
  </body>
</html>

Svelte

<script>
  import { PC } from "missing-coordinates";
</script>

<main>
  <PC
    data={{
      name: "sample",
      axes: [
        { name: "A", data: ["A", "A", "A", "A", "B", "B"] },
        { name: "B", data: [0.0, null, 0.4, null, 0.8, 1.0] },
        { name: "C", data: [0.0, 0.2, 0.4, 0.6, 0.8, 1.0] },
      ],
    }}
  />
</main>

For detailed usage instructions, see packages/missing-coordinates.

Packages

missing-coordinates

The main package including the implementation for parallel coordinates with missing data.

Storybook

An interactive web demo of missing-coordinates with examples of data sets, editable configurations, and configurable removal amounts.

Contributing

You can find detailed informations on how to contribute to this project in our contribution guide.

Citation

If you find this work or code useful please consider citing us:

@inproceedings{bauerle2022did,
  title={Where did my Lines go? Visualizing Missing Data in Parallel Coordinates},
  author={B{\"a}uerle, Alex and van Onzenoodt, C and der Kinderen, S and Westberg, J Johansson and J{\"o}nsson, Daniel and Ropinski, Timo},
  booktitle={Computer Graphics Forum},
  volume={41},
  number={3},
  pages={235--246},
  year={2022},
  organization={Wiley Online Library}
}