Handle Tooltip Events

When a tooltip becomes shown or hidden, the Chart fires the tooltipShown or tooltipHidden event that you can handle with a function. If the handling function is not going to be changed during the lifetime of the widget, assign it to the onTooltipShown or onTooltipHidden option respectively, when you configure the widget.

JavaScript
$(function() {
    $("#chartContainer").dxChart({
        // ...
        onTooltipShown: function (e) {
            var point = e.target;
            // Handler of the "tooltipShown" event
        },
        onTooltipHidden: function (e) {
            var point = e.target;
            // Handler of the "tooltipHidden" event
        }
    });
});

If you are going to change the event handlers at runtime or if you need to attach several handlers to a single event, subscribe to this event using the on(eventName, eventHandler) method.

JavaScript
var tooltipShownHandler1 = function (e) {
    var point = e.target;
    // First handler of the "tooltipShown" event
};

var tooltipShownHandler2 = function (e) {
    var point = e.target;
    // Second handler of the "tooltipShown" event
};

$("#chartContainer").dxChart("instance")
    .on("tooltipShown", tooltipShownHandler1)
    .on("tooltipShown", tooltipShownHandler2);
See Also