0

以下代码鼠标悬停处理程序不工作,但当我删除鼠标悬停在相关的代码工作正常。 (由于chart.draw()工作不正常)。伙计们可以帮我解决这个问题。鼠标悬停事件处理程序不工作当鼠标悬停事件处理程序是一个在谷歌图表脚本

google.setOnLoadCallback(drawChart); 
    function drawChart() { 

    var data = google.visualization.arrayToDataTable([ 
     ['Task', 'Hours per Day'], 
     ['Work',  11], 
     ['Eat',  2], 
     ['Commute', 2], 
     ['Watch TV', 2], 
     ['Sleep', 7] 
    ]); 

    var options = { 
     title: 'My Daily Activities', 
     legend: 'none', 
     pieSliceText: 'percentage', 
     slices: { } 
    }; 

    var chart = new google.visualization.PieChart(document.getElementById('piechart')); 
    chart.draw(data, options); 

    google.visualization.events.addListener(chart, 'onmouseout', function(e) { 

     var slices = options.slices ; 
     slices[e.row] = {}; 
     options['slices'] = slices;    
     chart.draw(data,options); 
     } 
    ); // mouse out end 

    google.visualization.events.addListener(chart, 'onmouseover', function(e) { 

     var sliceid= e.row; 
     console.log("mouse over"+sliceid); 
     var slices = options.slices ; 
     slices[e.row] = {offset:0.2}; 
     options['slices'] = slices; 
     chart.draw(data,options); 
      } 
    ); // mouse over end 
    } 
+0

奇怪的错误,似乎如果添加两个事件侦听器,它不工作,但在取出鼠标悬停使鼠标移开工作 – juvian 2014-10-14 16:57:40

+0

但我需要这两个事件对我图表。我通过删除两个事件处理程序中的代码进行了检查,并且放置了一个'alert'消息,两个事件都正常运行,只有事件处理程序中的chart.draw(数据,选项)存在问题。 – 2014-10-16 03:45:41

回答

0

似乎问题是mouseover重复发生,所以图表一直重绘,没有给mouseover事件足够的时间触发。这应该使其工作:

google.visualization.events.addListener(chart, 'onmouseover', function(e) { 
     var sliceid= e.row; 
     var slices = options.slices ; 
     if(slices.hasOwnProperty(e.row)){ 
      if(slices[e.row].hasOwnProperty('offset')) return false // if still mouseover, skip 
     } 

工作小提琴:http://jsfiddle.net/qm7f86ez/