Kibana chart element opacity on legend hover


(Adam Whittaker) #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,


(Lee Drengenberg) #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);
  };

(Lee Drengenberg) #3

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


(Adam Whittaker) #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);
    };

(Lee Drengenberg) #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.


(Adam Whittaker) #6

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


(Lee Drengenberg) #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.


(Adam Whittaker) #8

Thanks for submitting this.. Much appreciated.


(system) #9