2017-05-28 95 views
0

我正在使用canvas js。我有餅圖和圓環圖。使用工具提示有點問題。如果我將鼠標懸停在圓環圖上,然後在餅圖上看到兩個圖表的工具提示。像這樣如何一次只顯示一個工具提示

- See

這裏是 jsfiddle

的代碼鏈接非常簡單 - HTML

<div id="parent"> 
    <div id="doughnutContainer" uniqueID ='doughnut'></div> 
    <div id="pieContainer" uniqueID ='pie'></div> 
</div> 

創建數據圖表 -

var chart1 = new CanvasJS.Chart("doughnutContainer", 
{   
    data: [ 
    { 
     type: "doughnut", 
     dataPoints: [ 
      { y: 71 }, 
      { y: 55 }, 
      { y: 50 }, 
      { y: 65 }, 
      { y: 95 }, 
      { y: 68 }, 
      { y: 28 }, 
      { y: 34 }, 
      { y: 14 } 
     ] 
    }, 

    ] 
}); 
var chart2 = new CanvasJS.Chart("pieContainer", 
{   
    backgroundColor: "transparent", 
    data: [ 
    { 
     type: "pie", 
     dataPoints: [ 
      { y: 71 }, 
      { y: 55 }, 
      { y: 50 }, 
      { y: 65 }, 
      { y: 95 }, 
      { y: 68 }, 
      { y: 28 }, 
      { y: 34 }, 
      { y: 14 } 
     ] 
    } 
    ] 
}); 

chart1.render(); 
chart2.render(); 

任何人都可以幫我解決這個問題。謝謝

回答

1

你可以做一個簡單的JQuery技巧,通過隱藏圖表的工具提示時,懸停在另一個。

類似:

$("#pieContainer").hover(function(){ 
     $("#doughnutContainer .canvasjs-chart-tooltip").hide(); 
    } 
); 

Updated jsFiddle