title: HighCharts : Highlight entire series when hover and restore state when out
body: <p>I try to highlight an entire serie when hovering in a column chart. Due to the nature of the needed chart all columns are set side by side without spacing.</p>
  
  <p>I partially succeeded in doing so by using <strong>mouseOver</strong> and <strong>mouseOut</strong> on the series, but it doesn't work when hovering to the next element of the same serie. The entire serie should remain highlighted, but i'm not able to disable the mouseOut if hovered within the same serie.</p>
  
  <p>I tried doing by this code:</p>
  
  <pre><code>        series: [
              {
                  events: {
                  mouseOver: function() {
                      for(var i=0; i&lt;this.data.length; i++)
                      {
                          this.data[i].setState('hover');
                      }
  
                  },
                  mouseOut: function(){
  
                      for(var i=0; i&lt;this.data.length; i++)
                      {
                          this.data[i].setState('');
                      }
                  }},
  </code></pre>
  
  <p>I put this in <a href="http://jsfiddle.net/uhjbY/" rel="nofollow noreferrer">jsFiddle</a></p>
  
  <p>When you hover the lightblue serie, it get highlighted entirely, but when hovering to the next element within that serie, the serie should remain highlighted entirely, but my expirement the elements get highlighted at random.</p>
  
  <p><img src="https://i.stack.imgur.com/Sflj9.png" alt="enter image description here"></p>
  
  <p>Any help appreciated</p>
  
  <hr>
  
  <p><strong>Update:</strong></p>
  
  <p>Based on the <strong>solution provided by <a href="https://stackoverflow.com/users/1987838/robert-rozas">Robert</a></strong> I added a little modification. By introducing the activation of the hover state on the tooltip formatter event, the mouseOver behavior became redundant and I removed it.</p>
  
  <p>Solution : <a href="http://jsfiddle.net/9W8h4/3/" rel="nofollow noreferrer">jsFiddle</a></p>