marmelab / marmelab/EventDrops

Dot's disappearing when minimum scale is 1 and constraint on zoom

Open
#265 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
1.3k
Forks
233
PR merge metrics
No merged PRs in 30d

Description

**What you were expecting:**

So when the minimum scale is set to 1 (one cannot zoom out more than the boundaries of the data. So say, we have 1 January 2017 and 31 December 2017, one cannot zoom out more than a year).

Then I modified the zoom to add transelateExtent and extent, this avoids the panning outside the initial boundaries. So it is not possible to pan to say 2016 or 2018 (might make a PR for this soon).

**What happened instead:**

This, however, causes some drops to not be able to see with panning when zoomed in. This is because the drops are on the extreme edges of the viewport. See the pictures below:
Shows the right hand of the chart, where the date is cut off (on the axis)
![Shows the right hand of the chart, where the date is cut off](https://user-images.githubusercontent.com/15114362/56295266-6acc4680-6124-11e9-85bb-8baee23bf5c9.png)

Zoomed in and panned to the right as much as possible. It is not possible to reach the drops further to the right.
![Zoomed in and panned to the right as much as possible](https://user-images.githubusercontent.com/15114362/56295313-7fa8da00-6124-11e9-8ad9-ba93db221a3e.png)

Just showing the elements and length
![No drops after](https://user-images.githubusercontent.com/15114362/56295388-a6ffa700-6124-11e9-844c-2b12213a47fb.png)

![Drops after](https://user-images.githubusercontent.com/15114362/56295394-ac5cf180-6124-11e9-8aaf-631d6f7548e0.png)

Not really a bug, but maybe add some right and left margins to the chart in order to avoid the zoomable problem?

Will have a look at it

**Environment**

* EventDrops version 1.3.0
* Browser: Chrome Version 73.0.3683.86 (Official Build) (64-bit)

Contributor guide

No contributing guide indexed for this repository

Research direction

Reproduce the EventDrops chart with minimum scale set to 1 and zoom constrained by translateExtent and extent. Start by tracing the zoom configuration and compare the reachable viewport with the event positions at both edges. Done means users can pan to and see drops at the extreme left and right boundaries without allowing panning beyond the data range.

Written by the indexing model from the issue text.

Assessment

Tech stack
d3, javascript
Domain
data-visualization
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.