javascript - 如何在c3图表中设置散点图的工具提示内容？

Question

我正在尝试绘制 c3 散点图。当鼠标悬停在工具提示上时，它会显示数据集名称。相反，我想在该工具提示上显示自定义文本。我的代码片段如下。 current image

var chart = c3.generate({
                    bindto: '#scatter',
                    data: {
                        xs: {
                            positive: 'positive_x',
                            negative: 'negative_x',
                            neutral: 'neutral_x'
                        },
                        columns: [
                            $scope.positiveXvalue,
                            $scope.positiveYvalue,
                            $scope.negativeXvalue,
                            $scope.negativeYvalue,
                            $scope.neutralXvalue,
                            $scope.neutralYvalue
                        ],
                        colors: {
                            positive: '#008000',
                            negative: '#FF0000',
                            neutral: '#A9A9A9'
                        },
                        type: 'scatter'
                    },
                    axis: {
                        x: {
                            label: 'Sentiment',
                            tick: {
                                fit: false
                            }
                        },
                        y: {
                            label: 'Followers'
                        }
                    });

如何在鼠标悬停时添加自定义标签(作为工具提示)？

Answer 1

您一定在寻找tooltip.format.title .

对于散点图，存在一些差异。

tooltip.format.title 中指定的函数接收悬停数据点的坐标。对于传统的折线图/条形图，它只是整数索引。
但对于散点图，它采用“x.y”格式。所以你可能需要拆分它:

tooltip: {
  format: {
    title: function (coord) {
        var xy = coord.toString().split('.');
        return 'Data at [' + xy[0] + ',' + xy[1] + ']';
    }
  }
}

进一步的实现取决于您的自定义标题的存储方式。