Angular Nvd3 - 工具提示自定义无效

时间:2017-01-09 11:50:34

标签: javascript coffeescript angular-nvd3

我正在制作一张需要自定义tooltip的图表 我一直在设置生成功能

使用chart.Tooltip.contentGenerator 即使在悬停时,该功能似乎也不会被调用。我不明白为什么这不起作用

我正在使用nvd3-angular 1.0.5

$scope.chart_options =
        label_interval : label_interval
        chart:
            tooltip:
                contentGenerator:(t)->
                    console.log 'tooltip'
                    return '<div>hello tooltip content </div>'
            type:         'multiBarChart',
            height:       300,
            groupSpacing: 0.05,
            forceX : [$scope.start.toDate(), $scope.end.toDate()],
            duration: 500,
            reduceXTicks : false
            transitionDuration: 1000,
            padData: true,
            duration:1000,
            margin:
                top: 20,
                right: 20,
                bottom: 60,
                left: 50
            ,
            x : (d) ->
                return d.date_time.toDate()
            y : (d) ->
                if !d.gross_impressions
                    return 0;
                return d.gross_impressions
            xAxis:
                #showMaxMin  :false
                tickValues : $scope.tickValues,
                showMaxMin:true
            ,
            yAxis:
                axisLabel: "Y Axis"
                #axisLabelDistance: 20
                #tickFormat: (d)->return $scope.measures[$scope.selected_measure].value_formatter(d)
                tickFormat: (d)->
                    return d
            ,
            useInteractiveGuideline:false,
            showLegend:false,
            showControls:false,
            interactive: true,
            tooltips: true,

1 个答案:

答案 0 :(得分:1)

使用此工具提示再试一次:

tooltip: {
                enabled: true,
                contentGenerator: function (key) {
                    return  "<div>hello tooltip content </div>";
                }
            }

它适用于此:http://plnkr.co/edit/Dx2WJs?p=preview