# highcharts-draggable-points

> Highcharts plugin that allows points to be dragged and dropped by mouse or touch.

Latest version **2.0.10** (published 2018-11-09) · MIT license · 0 weekly downloads

> **Deprecated.** This package is deprecated.

## Install

```sh
npm install highcharts-draggable-points
pnpm add highcharts-draggable-points
yarn add highcharts-draggable-points
bun add highcharts-draggable-points
```

## Health

**Score 10/100 (F)** — status: deprecated.

Negative: deprecated.

## Facts

| | |
|---|---|
| Version | 2.0.10 |
| Published | 2018-11-09 |
| First published | 2016-01-26 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 18.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 32 |
| Author | Torstein Hønsi |
| Maintainers | cvasseng, gvaartjes, jon-a-nygaard, torsteinhonsi |
| Keywords | draggable, highcharts, highcharts-addon |

## Links

- npm: https://www.npmjs.com/package/highcharts-draggable-points
- Repository: https://github.com/highcharts/draggable-points
- Homepage: https://github.com/highcharts/draggable-points#readme
- Issues: https://github.com/highcharts/draggable-points/issues
- npm.io page: https://npm.io/package/highcharts-draggable-points

## Dependencies (1)

- [highcharts](https://npm.io/package/highcharts.md) >=3.0.0

## Alternatives

- [d3-force-3d](https://npm.io/package/d3-force-3d.md) — 1.0M weekly downloads
- [ng2-charts](https://npm.io/package/ng2-charts.md) — 486.8K weekly downloads
- [@arcgis/core](https://npm.io/package/@arcgis/core.md) — 257.8K weekly downloads
- [react-sparklines](https://npm.io/package/react-sparklines.md) — 249.3K weekly downloads
- [react-native-gifted-charts](https://npm.io/package/react-native-gifted-charts.md) — 182.3K weekly downloads

## Recent versions

- 2.0.10 (latest) — 2018-11-09
- 2.0.9 — 2018-04-08
- 2.0.8 — 2018-01-25
- 2.0.5 — 2016-11-03
- 2.0.4 — 2016-09-02
- 1.2.0 — 2016-01-26

## README

Deprecated: Draggable Points for Highcharts
================

This plugin is deprecated as of November 2018, and replaced by the featured
[draggable-points](https://api.highcharts.com/highcharts/plotOptions.series.dragDrop)
Highcharts module that includes the same functionality and more.

_______________________________________________________________________________
This plugin allows the user to drag the points in the chart, making them able to edit data directly in the chart.

The contents of the plugin is located in the javascript file `draggable-points.js`. 
This plugin is published under the MIT license, and the license document is included in the repository.

Online demos:
* [Combined series](http://jsfiddle.net/highcharts/AyUbx/) 
* [Bubble series](http://jsfiddle.net/highcharts/sk3m3o7d/)

### Options

| Option name | Type | Description |
| ----------- | ---- | ----------- |
| `chart.zoomKey` | String | Allows setting zoom key. Can be one of `alt`, `ctrl`, `meta` (the command key on Mac and Windows key on Windows) or `shift`, and should be set different than `chart.panKey`. It is useful when [`series.stickyTracking`](https://api.highcharts.com/highcharts/plotOptions.series.stickyTracking) is enabled. |
| `plotOptions.series.cursor`| String | Highcharts core option. We recommend setting a cursor that indicates to your users that the point can be dragged, for example `ns-resize` or `move`. |
| `plotOptions.series.data.draggableX` | Boolean | If dragging is enabled on the series, set this to false to prevent dragging on a single point. |
| `plotOptions.series.data.draggableY` | Boolean | If dragging is enabled on the series, set this to false to prevent dragging on a single point. |
| `plotOptions.series.draggableX` | Boolean | Enable draggable along the X axis. |
| `plotOptions.series.draggableY` | Boolean | Enable draggable along the Y axis. |
| `plotOptions.series.dragHandlePath` | Function | Column series only. A custom path for the drag handle. |
| `plotOptions.series.dragHandleFill` | Function | Column series only. Fill color for the drag handle. |
| `plotOptions.series.dragHandleStroke` | Function | Column series only. Stroke color for the drag handle. |
| `plotOptions.series.dragMaxX` | Number | The maximum X value to drag to for this series. |
| `plotOptions.series.dragMaxY` | Number | The maximum Y value to drag to for this series. |
| `plotOptions.series.dragMinX` | Number | The minimum X value to drag to for this series. |
| `plotOptions.series.dragMinY` | Number | The minimum Y value to drag to for this series. |
| `plotOptions.series.dragPrecisionX` | Number | The X precision value to drag to for this series. |
| `plotOptions.series.dragPrecisionY` | Number |The Y precision value to drag to for this series.  |
| `plotOptions.series.dragSensitivity` | Number | The amount of pixels to drag the pointer before it counts as a drag operation. This prevents drag/drop to fire when just clicking or selecting points. Defaults to 1. |
| `plotOptions.series.point.events.drag` | Function | Callback that fires while dragging. Temporary point values can be read from `e.newX` and `e.newY`. Original values are available in `e.dragStart`. |
| `plotOptions.series.point.events.drop` | Function | Callback that fires when the point is dropped. Original values are available in `e.dragStart`. The `Point` object is the context. Return false to cancel the drop. |

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