Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Resolve labels overlapping in BarGauge and Funnel #7167

Open
pavelgruba opened this issue Mar 5, 2019 · 1 comment

Comments

Projects
None yet
2 participants
@pavelgruba
Copy link
Contributor

commented Mar 5, 2019

The Problem

Labels in the Funnel and BarGauge widgets can overlap each other but the widgets do not provide any options to avoid this.
labels_issue

The Proposed Solution

We will introduce a new option, resolveLabelOverlapping, that specifies how the widget should behave when labels overlap each other.

In the Funnel, this option accepts shift (default), hide, and none as values. If there is still no room to display all the labels after they are shifted, the algorithm hides certain labels.

In the BarGauge, resolveLabelOverlapping will accept hide (default) and none.

The following images illustrate the different modes:

let funnelOptions = {
    resolveLabelOverlapping: "shift"
};

funnel_shift

let funnelOptions = {
    resolveLabelOverlapping: "hide"
};

funnel_hide

let barGaugeOptions = {
    resolveLabelOverlapping: "hide"
};

image

We Need Your Feedback

Take a Quick Poll

Do you find the resolveLabelOverlapping option helpful?

Live Sandbox

Funnel examples - jQuery, Angular

Get Notified of Updates

Subscribe to this thread or to our Facebook and Twitter accounts for updates on this topic.

@pavelgruba

This comment has been minimized.

Copy link
Contributor Author

commented Mar 13, 2019

Update: The Live Sandbox section has been added.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.