c3js / c3js/c3

Point selection by dragging and unselect by clicking does not work in one condition

Open
#2,793 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
9.3k
Forks
1.4k
Avg merge
6d 16h
Merged PRs (30d)
1

Description

* **C3 version**: 0.7.15 (latest)
* **D3 version**:5.16.0
* **Browser**:Chrome/Safari
* **OS**:Mac OS 10.14.5

There is a definite issue with the data point selection support. My data series has some selectable and some non selectable data points. I select the data points with a mouse drag to select few points. Now if I try to unselect them by clicking on them then they don't get unselected. However if I stick to the same method for unselect i.e. to drag the mouse again then the points get unselected.

Also note that the behaviour is observed only when the data series has a combination of selectable and non selected points. If the entire series is selectable then the issue is not observed.

On deeper analysis I found out that actually the unselect event is getting triggered and the point is no more in the selected list but the circle which surrounds the point stays there. Hence it is an issue with the select circle.

Here is the Stackblitz demo and the code. [ #c3-chart-error](https://stackblitz.com/edit/c3-chart-example-seujfh?file=app%2Fapp.component.ts)

Here all points above 5 are selectable. Please follow the below steps to reproduce the issue.

1. Mouse drag/drop on points above value 5 to select them. (one or more)
2. Click on the selected point. The circle doesn't go away.

Thanks

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.