Kibana chart element opacity on legend hover

Elastic Stack Kibana
1

Hello,

Is there a way in the code or otherwise to change the default opacity that is set on chart elements when one item is hovered over? I would like to to make the none selected items more transparent so that the item i am interested in is more apparent.

Thanks,

2

There's no built-in setting for that. I found the code here in src/ui/public/vislib/lib/dispatch.js. I changed it from 0.5 to 0.1 and it made a big difference;

  /**
   * Mouseover Behavior
   *
   * @param element {D3.Selection}
   * @method highlight
   */
  Dispatch.prototype.highlight = function (element) {
    var label = this.getAttribute('data-label');
    if (!label) return;
    //Opacity 1 is needed to avoid the css application
    $('[data-label]', element.parentNode).css('opacity', 1).not(
      function (els, el) { return `${$(el).data('label')}` === label;}
    ).css('opacity', 0.5);
  };
3

Feel free to create an issue for an enhancement to have a setting for it here; https://github.com/elastic/kibana

4

@LeeDr Does kibana need to be built after making this change or can i just restart the server? I tried changing the opacity and then restarting but it didnt change anything - i am on the last release of kibana (not 4.5) and the code in that file is slightly different:

   /**
     * Mouseover Behavior
     *
     * @param element {D3.Selection}
     * @method highlightLegend
     */
    Dispatch.prototype.highlightLegend = function (element) {
      var label = this.getAttribute('data-label');
      if (!label) return;
      $('[data-label]', element.parentNode).not('[data-label="' + label + '"]').css('opacity', 0.5);
    };
5

Hi,

Yes, you would have to checkout that 4.5 branch of source and run from that. That's why I suggested the enhancement issue so you could have a production-ready setting for it.

6

OK, will do. Thank you very much for your help.

7

FYI, I created an issue for this and it was just merged into Kibana master. I'm not sure if it's making it into the 5.0 release that's coming up or not.

8

Thanks for submitting this.. Much appreciated.