更改chartjs-2中工具提示的z索引

Question

我正在運行react-chartjs2的問題。我想以某種方式改變工具提示的z-index。我無法從文檔中找到屬性，所以我想知道你是否知道一個合適的解決方案。以下是我的圓環圖的截圖：

你可以看到我的問題。現在顯示一半的工具提示。我真的很感謝你的幫助

這裏是我的代碼：

<Doughnut 
     data={sectorsData} 
     width={250} 
     height={250} 
     redraw 
     options={{ 
      legend: { 
      display: false 
      }, 
      maintainAspectRatio: true, 
      responsive: true, 
      cutoutPercentage: 80, 
      animation: { 
      animateRotate: false, 
      animateScale: false 
      }, 
      elements: { 
      center: { 
       textNumber: `${sectorsCounter}`, 
       text: intl.formatMessage({ id: 'pie.sectors' }), 
       fontColor: '#656566', 
       fontFamily: 'EurobankSans', 
       fontStyle: 'normal', 
       minFontSize: 25, 
       maxFontSize: 25, 
      } 
      }, 
      /*eslint-disable */ 
      tooltips: { 
      custom: (tooltip) => { 
       tooltip.titleFontColor = '#656566'; 
       tooltip.titleFontFamily = 'EurobankSans'; 
       tooltip.bodyFontColor = '#656566'; 
       tooltip.bodyFontFamily = 'EurobankSans'; 
       tooltip.backgroundColor = '#eaeeef'; 
      }, 
      /* eslint-enable */ 
      callbacks: { 
       title: (tooltipItem, data) => { 
       const titles = data.datasets[tooltipItem[0] 
        .datasetIndex].titles[tooltipItem[0].index]; 
       return (
        titles 
       ); 
       }, 
       label: (tooltipItem, data) => { 
       const labels = 
        NumberFormatter(data.datasets[tooltipItem.datasetIndex] 
        .labels[tooltipItem.index], 
        2, 
        decimalSep, 
        thousandSep 
       ); 
       return (
        labels 
       ); 
       }, 
       afterLabel: (tooltipItem, data) => { 
       const afterLabels = data.datasets[tooltipItem.datasetIndex] 
        .afterLabels[tooltipItem.index]; 
       return (
        afterLabels 
       ); 
       }, 
      }, 
      }, 
     }} 
     /> 

Answer 1

應用定製className或id的組件，只需設置圖表的canvas元素更高的z-index。

從代碼來看，這樣的事情應該工作：

<div id="my-doughnut-chart-1"> 
<Doughnut 
...props 
/> 
</div> 

CSS：

#my-doughnut-chart-1 canvas { z-index: 9999 // just an example z-index, change it according to your project }