2013-05-21 66 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); 
        } 
       } 
      },