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] + ']';
    }
  }
}

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

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

1 个答案: