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

Get Label when clicking on Bar chart #3478

Closed
Galleria opened this issue Oct 16, 2016 · 5 comments
Closed

Get Label when clicking on Bar chart #3478

Galleria opened this issue Oct 16, 2016 · 5 comments

Comments

@Galleria
Copy link

Hi everybody.

I have a question about tooltips.
Can I get a label when clicking on bar chart ? (multiple labels on each segment but i would like to get only one that mouse on hover it )

Thanks,
:")

@etimberg
Copy link
Member

@Galleria this is possible. The bars have _datasetIndex and _index properties which uniquely identify which item was clicked. You can then look up the label in the data object

@Galleria
Copy link
Author

Galleria commented Oct 17, 2016

It's sure if there is one segment instance as below,

array[1]
    [Element]
        _datasetIndex:0
        _index: 0
        _view: Object
            datasetLabel: "AAA"

But I couldn't get it if there is more than one segment because it returned all label instance as below,

array[3]
    [Element]
        _datasetIndex:0
        _index: 0
        _view: Object
            datasetLabel: "AAA"
    [Element]
        _datasetIndex:1
        _index: 0
        _view: Object
            datasetLabel: "BBB"
    [Element]
        _datasetIndex:2
        _index: 0
        _view: Object
            datasetLabel: "CCC"

Thanks,

@etimberg
Copy link
Member

ah, I see what you're running into.

You have a few options though this will be best fixed in the next release due to #3400
With #3400 the new 'nearest' mode works much better and is guaranteed to only return a single element.

Before that happens, you could hit test the elements yourself to see which is the one you want. This snippet can get you started.

// helper function that translates an event to a position in canvas coordinates
var pos = helpers.getRelativePosition(e, chart);

// inRange is the function on the chart element that is used for hit testing
var intersect = elements.filter(function(element) {
  return element.inRange(pos.x, pos.y);
});

@Galleria
Copy link
Author

Thanks, :")
👍

@mitrin359
Copy link

Hi @etimberg
Can you help me on getting the accurate label and value when clicking on stacked bar chart, tried with activepoints but couldn't suceed and above pos I'm not getting in 2.5 version

Thank you

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants