ng2-chart工具提示位置更改选项? [英] ng2-chart tooltip position change option?

问题描述

我正在尝试使用针对Chart.js的ng2-chart Angular2指令来构建甜甜圈图.此chart.js具有工具提示定位的默认选项，我想使工具提示显示在图表外部.有没有办法使之成为可能?

I am trying to build a Doughnut Chart using ng2-chart Angular2 directives for Chart.js. This chart.js has default option for tooltip positioning, I want to make tooltip to show outside the chart. Is there a way to make it possible?

public doughnutChartOptions = {
 responsive: true,
  tooltips:{
   mode: 'nearest',
  }
}

我希望工具提示之类的内容显示在图表外部，而不是显示在图表内部；顶部，底部和侧面.

I expect something like tooltip to be displayed outside the chart, Instead of showing inside the chart; top, bottom and to sides.

推荐答案

您可以像这样在 tooltip 上使用 custom 属性.

You can use custom property on tooltip like this.

tooltips:{
  custom:function(tooltipModel){

   //Top-Left
    tooltipModel.x=10;
    tooltipModel.y=0;

  }.bind(this)

实时示例链接为: https://stackblitz.com/edit/ng2-charts-doughnut-template-6wef9r

这篇关于ng2-chart工具提示位置更改选项?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！