title: Series fillColor for marker on hover ONLY
body: <p>I "faked" a clear circle as markers by setting the fillColor the same as the background. It works just fine. Now, on hover, I am trying to get the circle to fill with the series color. I can't set it as null, as then it takes the background color still.</p>
  
  <p>Any ideas?</p>
  
  <p>Here is my chart code (live version here:<a href="http://jsbin.com/ukabob/2/edit" rel="nofollow">http://jsbin.com/ukabob/2/edit</a>):</p>
  
  <pre><code>$(function () {
  var chart;
  $(document).ready(function() {
      chart = new Highcharts.Chart({
          chart: {
              renderTo: 'container',
              type: 'line',
              backgroundColor: '#E9E7DC'
          },
          colors: ['#A74B59', '#46C4B7', '#EDBA70'],
          credits: {
            enabled: false
          },
          title: {
              text: null
          },            
          xAxis: {
              categories: ['2013', '2014', '2015', '2016', '2017', '2018',
                  '2019', '2020', '2021', '2022'],
              gridLineWidth:1,
              gridLineColor: '#FFFFFF',
              labels: {
                style: {
                  color: '#000000'
                },
                formatter: function() {
                  return '&lt;div style="font-size:22px; font-family: \'Advent Pro\', sans-serif;"&gt;'+
                      this.value +'&lt;/div&gt;';
                },
                y:25
              },
              lineColor: '#FFFFFF',
              tickColor: '#FFFFFF',
              tickLength: 30
          },
          yAxis: {
              gridLineWidth:0,
              title: {
                  text: null
              },
              labels: {
                enabled: false
              }
          },
          plotOptions: {
            series: {
              marker: {
                  radius: 6,
                  fillColor: '#E9E7DC',
                  lineWidth: 2,
                  lineColor: null, // inherit from series
                  symbol: 'circle',
                  states: {
                      hover: {
                          fillColor: null,
                          lineWidth: 2,
                        radius:6
                      }
                  }
              },
              states: {
                hover: {
                  lineWidth:4
                }
              }
            }
          },
          tooltip: {
              borderWidth:0,
              borderRadius: 0
              },
          legend: {
              layout: 'vertical',
              align: 'right',
              verticalAlign: 'top',
              x: -10,
              y: 100,
              borderWidth: 0
          },
          series: [{
              name: 'Honeywell',
              data: [700,725,750,850,950,1000,1025,1050,1050,1050]
          }, {
              name: 'Bombardier',
              data: [661,758,880,990,1065,1136,1193,1241,1289,1335]
          }, {
              name: 'Embraer',
              data: [747,789,839,861,890,908,984,1030,1097,1156]
          }]
      });
  });
  
  });
  </code></pre>