Search code examples
tooltipc3

OnMouseover - Hidden Tooltip for a particular series with C3 library


I have a LineChart with two simple lines, I have to have the possibility to hide the tooltips (render a line not selectable) for a particular series. Is it possible to achieve it with some apis provided?

I'm trying to develop my particular behaviour:

onmouseover: function (d, node){
                if (d.id=="Requested")
                {
                    __  what here?
                }
            }

Solution

  • I solved by adding the if statement in the content generator.

    tooltip: 
            {
    
                contents: function (d, defaultTitleFormat, defaultValueFormat, color) 
                {
                    var $$ = this, config = $$.config, CLASS = $$.CLASS,
                    titleFormat = config.tooltip_format_title || defaultTitleFormat,
                    nameFormat = config.tooltip_format_name || function (name) { return name; },
                    valueFormat = config.tooltip_format_value || defaultValueFormat,
                    text, i, title, value, name, bgcolor;
    
                // You can access all of data like this:
    
                    var count=0;
                    for (i = 0; i < d.length; i++) 
                    {
    
                        **if (d[i].id=="Requested")** {
                        if (! (d[i] && (d[i].value || d[i].value === 0))) { continue; }
    
                        // ADD
    
    
    
                        if (! text) 
                        {
    
                            var formats=d3.time.format('%Y%m%d');
                            var date= new Date(formats.parse(scene[d[i].index].date));
    
                            title = date.getDate()+"/"+date.getMonth()+1+"/"+date.getFullYear();
                            text = "<table class='" + CLASS.tooltip + "'>" + (title || title === 0 ? "<tr><th colspan='2'>" + title + "</th></tr>" : "");
                        }
    
    
                          }//if requested
                    }