하이 차트 파이 차트에서 호버를 클릭하십시오.

Question

마우스를 올려 놓을 때 원형 차트에서 마우스 클릭 이벤트를 호출하려면 어떻게해야합니까? 나는 무언가를 시도했다. 그러나 내가 필요로하는 것에 따라 부드럽게 그렇게 클릭하지 않는다. 다음은 코드 샘플입니다 : 여기

plotOptions: { 
     pie: { 
      innerSize: '50%', 
      size: 100, 
      cursor: 'pointer', 
      dataLabels: false 
     }, 
     series: { 
      allowPointSelect: true, 
      type: 'pie', 
      name: 'Coordinates', 
      point: { 
       events: { 
        mouseOver: function (e) { 
         pieChart.tooltip.hide(); 
         var serie = this.series.data[this.x]; 
         var waitBeforeSelect = setTimeout(function() { 
          clearTimeout(waitBeforeSelect); 
          serie.select(); 
          serie.series.show(); 
          pieChart.tooltip.refresh(serie); 
         }, 500); 

         var serieName = serie.name; 
         var textToShow = serieName.substr(0, serieName.indexOf(';')); 
         $('#pieChartInfoText').children().text(textToShow); 
         $('#pieChartInfoText').children().css('color', serie.color); 
        }, 
        mouseOut: function() { 
         pieChart.tooltip.hide(); 
        } 
       } 
      } 
     } 
    }, 

Answer 1

당신이 :

http://jsfiddle.net/XErNG/2/ 나는이 예제는 당신의 필요를 충족 것이라 생각합니다.

Answer 2

고맙습니다. 이고르. 예, 제게 많은 도움이되지만 내 자신이 가지고있는 몇 가지 단점이 있습니다 (마우스를 차트 위로 여러 번 움직이면 반복적으로 앞뒤로 움직이며 특히 도넛 형 차트에 표시됨). 그러나 나는 고칠 수 있습니다. 코드 스 니펫 :

series: { 
      allowPointSelect: true, 
      type: 'pie', 
      name: 'Coordinates', 
      point: { 
       events: { 
        mouseOver: function (e) { 
         var serie = this.series.data[this.x]; 
         if ((undefined == previousSerie) || (serie != previousSerie)) { 
          var point = this; 

          if (!point.selected) { 
           pieChart.tooltip.shared = true; 

           var timeout = setTimeout(function() { 
            clearTimeout(timeout); 
            point.firePointEvent('click'); 

            pieChart.tooltip.shared = false; 
            pieChart.tooltip.refresh(point); 
           }, 700); 
          } 

          var serieName = serie.name; 
          var textToShow = serieName.substr(0, serieName.indexOf(';')); 
          $('#pieChartInfoText').children().text(textToShow); 
          $('#pieChartInfoText').children().css('color', serie.color); 
          previousSerie = serie; 
         } else { 
          previousSerie = serie; 
         } 
        }, 
        mouseOut: function() { 
         // pieChart.tooltip.hide(); 
        } 
       } 
      } 
     } 

다시 한 번 감사드립니다.

Answer 3

정말로하려는 일은 mouseOver에서 포인트를 선택하는 것입니다 (질문에 이르게하는 데 필요한 것이 었음). mouseOver 함수에서 this.select (true)를 호출 할 수 있습니다. 이것은 타임 아웃 지연이 없지만 여전히 추가 될 수 있습니다.