2

我使用 nvd3-angularjs 的堆积面积图

这是我的html

<div ng-controller="Eth2GraphController">

    <nvd3-stacked-area-chart
    data="GraphData"
    noData="No Data For You!"
    id="eth2Graphs"
    showXAxis="true"
    showYAxis="true"
    showLegend="true"
    interactive="true"
    tooltips="true"
    objectEquality="true"
    margin="{left:100,right:100}"
    useInteractiveGuideline="true"
    tooltipcontent="toolTipContentFunction()"
    xAxisTickFormat="xAxisTickFormatFunction()"
    yAxisTickFormat="yAxisTickFormatFunction()"
    color="colorFunction()"
    legendColor="colorFunction()"
    >
        <svg></svg>
    </nvd3-stacked-area-chart>
</div>

现在，我有一个应该格式化工具提示内容的函数，但它不起作用。也许它与 useInteractiveGuideline 属性有关。我使用相同的工具提示内容功能来编辑我的其他图表的工具提示，它在这些图表上工作，唯一的区别是这些图表不使用 useInteractiveGuideline。

$scope.toolTipContentFunction = function() {
    return function(key, x, y, e, graph) {

        return        '<h3>' + x + '</h3>' + 
                 '<p>' + key + ' ' + y + '</p>';

    }
};

我希望 x 位于中心，以及数据的其他格式。我该怎么做？我是否使用了正确的属性来格式化工具提示？

4

1 回答 1

0

  1. 更改tooltipcontent="toolTipContentFunction()"为： tooltipContent="toolTipContentFunction"

  2. useInteractiveGuideline必须设置为 falsetooltipContent才能工作。我相信这是因为useInteractiveGuideline使用它自己的弹出窗口。

于 2015-06-17T19:55:58.893 回答