# safety-shift-plot

> Chart showing change in lab measures, vital signs and other related measures during the course of a clinical trial.

Latest version **2.1.3** (published 2019-08-19) · MIT license · 0 weekly downloads

## Install

```sh
npm install safety-shift-plot
pnpm add safety-shift-plot
yarn add safety-shift-plot
bun add safety-shift-plot
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 2.1.3 |
| Published | 2019-08-19 |
| First published | 2016-06-09 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 2 |
| Unpacked size | 110.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Rho, Inc. |
| Maintainers | jwildfire, pburnsdata, rhographics, samussiah |

## Links

- npm: https://www.npmjs.com/package/safety-shift-plot
- npm.io page: https://npm.io/package/safety-shift-plot

## Dependencies (2)

- [d3](https://npm.io/package/d3.md) ^3
- [webcharts](https://npm.io/package/webcharts.md) ^1.11.6

## Recent versions

- 2.1.3 (latest) — 2019-08-19
- 2.1.2 — 2019-05-17
- 2.1.1 — 2018-10-25
- 2.1.0 — 2018-05-02
- 2.0.6 — 2018-03-12
- 2.0.5 — 2018-03-09
- 2.0.3 — 2017-07-07
- 2.0.2 — 2017-03-14
- 2.0.0 — 2017-02-23
- 1.1.0 — 2016-06-09

## README

# Shift Plot for Clinical Trials
![alt tag](https://user-images.githubusercontent.com/31038805/33946258-4d8cc192-dfef-11e7-8049-f63ff351d826.gif)

## Overview
Safety Shift Plot is a JavaScript library, built using Webcharts ([1](https://github.com/RhoInc/Webcharts), [2](https://github.com/RhoInc/webcharts-wrapper-boilerplate)), that allows users to compare lab and vital sign values between two time points. A typical chart created with Saftey Shift Plot looks like the above chart when it is first loaded. It also features a self updating data listing below the chart that shows meta data about the selected points as pictured below. 

![alt tag](https://user-images.githubusercontent.com/31038805/33946248-46a9933c-dfef-11e7-8ac3-7f9ed6bcddf6.gif)

The chart uses the AdAM data standards by default, but can be customized to use any data set that is one record per measurement. Full details about chart configuration are [here](https://github.com/RhoInc/safety-shift-plot/wiki/Configuration).

Users can:
* See the shift plot to compare lab and vital sign values between two time points
* See the number and percentage of participants displayed in the current view (updates with each user interaction)
* Change the measure of interest, and see an updated chart
* Change the baseline visit(s) of interest, and see an updated chart
* Change the comparison visit(s) of interest, and see an updated chart
* Click and drag across data points to show a linked listing of the underlying data
* Filter the shift plot for selected criteria, and see an updated chart (optional)

## Typical Usage
In the simplest case, using a dataset matching all default requirements, the chart can be created with a single line of code.

```javascript
    safetyShiftPlot('body', {}).init(data);
```

The code to load a comma-delimited data set and initialize the customized chart, with filters and simple data mappings, looks like this: 

```javascript
    const settings = {
    time_col: 'VISIT'
    start_value: 'Potassium'
    x_params: {visits: ['Screening'], stat: 'min'}
    y_params: {visits: ['End of Study'], stat: 'max'}
    filters:[
        {value_col: 'SITEID', label: 'Site ID'},
        {value_col: 'SEX', label: 'Sex'},
        {value_col: 'RACE', label: 'Race'}
    ]
    };

    d3.csv(
        '../data/ADBDS.csv',
        function(data) {
            safetyShiftPlot('body', settings).init(data);
        }
    );
```

## Links 
- [Interactive Example](https://rhoinc.github.io/safety-shift-plot/test-page/)
- [Configuration](https://github.com/RhoInc/safety-shift-plot/wiki/Configuration) 
- [API](https://github.com/RhoInc/safety-shift-plot/wiki/API)
- [Technical Documentation](https://github.com/RhoInc/safety-shift-plot/wiki/Technical-Documentation) 
- [Data Guidelines](https://github.com/RhoInc/safety-shift-plot/wiki/Data-Guidelines)

---
_Source: https://npm.io/package/safety-shift-plot · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._