Chart.js与ng-chart2数据集弹窗方形标记改圆形无效问题咨询

你遇到的问题是因为dataset里的pointStyle属性只对折线图、散点图这类带独立数据点的图表生效，柱状图的Tooltip标记默认是和柱子形状绑定的矩形，所以直接在dataset里设置pointStyle不会起作用。

要修改Tooltip里的标记为圆形，需要通过配置Tooltip的回调函数来实现，具体步骤如下：

1. 在图表的options配置中，添加plugins.tooltip.callbacks.labelPointStyle回调，返回指定pointStyle为circle的对象：

// 完整的图表配置示例
public chartOptions: ChartConfiguration['options'] = {
  responsive: true,
  plugins: {
    tooltip: {
      callbacks: {
        labelPointStyle: (context) => {
          return { pointStyle: 'circle' };
        }
      }
    }
  }
};

public chartData: ChartConfiguration['data'] = {
  labels: ['你的标签数组'],
  datasets: [
    {
      data: this.salesSum,
      maxBarThickness: 100,
      borderRadius: 150
      // 这里不需要再设置pointStyle了
    }
  ]
};

2. 确保你的ng-chart2和Chart.js版本匹配（比如ng-chart2 v4.x对应Chart.js v3.x），不同版本的配置结构可能略有差异。

这样配置后，Tooltip里的标记就会变成圆形了。

内容的提问来源于stack exchange，提问作者Piinky