2013-05-21 94 views
0

我在Highcharts中實現了一個動畫餅圖,其中切片在鼠標懸停時拉出,並且除了on mouseOut我希望切片返回到「關閉」位置的問題外,位置。Highcharts餅圖在鼠標移出時返回切片動畫

這是動畫代碼,我在mouseOut上有一個clearTimeout,但是這不會將切片返回到原始位置。

是否有一種簡單的方法將圖表放置到其原始位置。

我這裏有一個小提琴...

http://jsfiddle.net/rupertito/Y3wvN/1/

pie: { 
     allowPointSelect: true, 
         stickyTracking: false, 

         point: { 
         events: { 
            legendItemClick: function() { 

              return false; 

            }, 
            mouseOver: function(event) { 
             var point = this; 

             if (!point.selected) {               
              timeout = setTimeout(function() { 
               point.firePointEvent('click'); 

               sectors.tooltip.refresh(point); 
              }, 20); 
             } 
            } 
           } 


          }, 
         events: { 
          mouseOut: function() { 
           clearTimeout(timeout); 

          }, 

         }, 

希望這一切有意義,感謝提前任何幫助。

乾杯 羅布

回答

5

這是錯誤報道here。這關乎的不是切點。還有解決方法是如何避免這個問題。而簡單的例子,你用鼠標懸停/鼠標移開:http://jsfiddle.net/GqfU4/8/

function setTranslation(p, slice){ 
    p.sliced = slice; 
    if(p.sliced){ 
     p.graphic.animate(p.slicedTranslation); 
    } else { 
     p.graphic.animate({ 
      translateX: 0, 
      translateY: 0 
     }); 
    } 
} 

和餅形:

  point: { 
       events: { 
        mouseOut: function() { 
         setTranslation(this, false); 
        }, 
        mouseOver: function() { 
         setTranslation(this, true); 
        } 
       } 
      },