Hello,
We are working on our Angular Dashboard again using the JS Chart component and one item we would like to tidy up is the Meta Data displayed in the Tool Tips against data points.
When the cursor is enabled and a data point is hovered over, tool tips with the meta data is displayed for all data points in the vertical line; please refer to the screenshot attached.
We would like the tool tip to only be shown when the cursor is on a specific data point. We are currently working with an offshore team and any help surrounding this would be appreciated.
Kind regards,
- Nathan Weatherington asked 2 years ago
- last edited 2 years ago
- You must login to post comments
Hi there,
One simple override is all you need to create a custom RolloverModifier:
class PointRolloverModifier extends RolloverModifier {
public hitTestRadius: number = 5;
public hitTestRenderableSeries(rs: IRenderableSeries, mousePoint: Point): HitTestInfo {
if (!mousePoint) {
return undefined;
}
return rs.hitTestProvider.hitTestDataPoint(mousePoint.x, mousePoint.y, this.hitTestRadius);
}
}
Normally RolloverModifier uses hitTestXSlice function which returns all the points on the line. This replaces that behaviour to return only the data point with a radius of the mouse position.
Best regards,
Andrew
- Andrew Burnett-Thompson answered 2 years ago
- You must login to post comments
Please login first to submit.
