CODEWITHSUNDEEP
highchartssankey-diagram
Bad Programmer
Bad Programmer

Reputation: 962

Different ToolTip text For Links and Nodes in Highcharts Sankey Charts

I have a Highcharts sankey diagram, and want the tooltip text when hovering over the nodes to be different than the link text. When I use just the formatter() method for tooltip, I get the text that I want to see for the links, but not the nodes. I tried using the nodeFormatter() method both in addition to the formatter() method and in place of it, but this totally overwrites what I am trying to do with the links.

    var chart = Highcharts.chart('chart_container', {

        title: {
            text: null
        },
        plotOptions: {
            sankey: {
                nodeWidth:100
            }
        },
        tooltip:{
            enabled: true,
            formatter: function() {
             //Return stuff here
            }
        },
        series: [
            {
                type: 'sankey',
                name: null,
                data:   migrationData.seriesData,
                nodes:  migrationData.nodes,
                dataLabels: {
                  enabled: true,
                },
            },

        ],
        allowPointSelect: true,
        enableMouseTracking: false,
        tooltip: {
        nodeFormatter: function() {
            //Just overwrites tooltip text for non-nodes as well
        }
    }
  });

Any idea how I can get the nodes to say something like "Category: number" and the links to have more intricate details in the tooltip?

Upvotes: 0

Views: 1404

Answers (1)

ppotaczek
ppotaczek

Reputation: 39099

You can use pointFormatter and nodeFormatter functions:

series: [{
    ...,
    tooltip: {
        nodeFormatter: function() {
            return 'some text for node'
        },
        pointFormatter: function() {
            return 'some text for link'
        }
    }
}]

Live demo: https://jsfiddle.net/BlackLabel/romtnqx5/

API Reference:

https://api.highcharts.com/highcharts/series.sankey.tooltip.pointFormatter

https://api.highcharts.com/highcharts/series.sankey.tooltip.nodeFormatter

Upvotes: 5

Related Questions