amCharts中如何修改Category Field的标签答案

【问题标题】：How to modify the label of Category Field in amChartsamCharts中如何修改Category Field的标签
【发布时间】：2026-01-29 03:25:01
【问题描述】：

我在我的 AngularJS 应用程序中使用 amCharts，我正在寻找一种方法来重命名类别字段的标签。以下是我的代码：

var configChart = function () {
            employeeChart = new AmCharts.AmSerialChart();
            employeeChart.categoryField = "empId";

            var yAxis = new AmCharts.ValueAxis();
            yAxis.position = "left";
            employeeChart.addValueAxis(yAxis);

            mcfBarGraph = new AmCharts.AmGraph();
            mcfBarGraph.valueField = "employeeRating";
            mcfBarGraph.type = "column";
            mcfBarGraph.fillAlphas = 1;
            mcfBarGraph.lineColor = "#f0ab00";
            mcfBarGraph.valueAxis = yAxis;
            employeeChart.addGraph(empBarGraph);

            employeeChart.write('employee');


        }

在上面的代码中，如果您观察到 categoryField 是 empId，那么在 x 轴上它会显示员工 ID，我想将其设为“dept-empId”。例如，如果部门编号为 1，则在 x 轴上显示 1-1,1-2 等。部门 ID 不在数据提供者中，而是我的控制器中的范围变量之一。您能告诉我如何实现这一目标吗？

【问题讨论】：

标签： angularjs amcharts ammap

【解决方案1】：

您可以在图表对象的 categoryAxis 中定义 labelFunction 以获得所需的格式。

var categoryAxis = employeeChart.categoryAxis;
categoryAxis.labelFunction = function(valueText) {
  return dept + '-' + valueText;
};

这是一个小提琴，它使用您的设置和一些虚拟数据来说明这一点：https://jsfiddle.net/by7grqjm/2/

【讨论】：

感谢您的帮助。但最初，当页面加载时，它给我的值是未定义的，一旦我再次刷新图表，值就会出现。该值是从 AngularJs 中的服务返回的，我将此值分配给一个变量并按照您建议的方式使用它。我尝试使用 console.log 打印该值，但该值未定义。那么在我刷新图表之前，你能告诉我为什么它是未定义的吗？
如果你能提供一个重现你的场景的小提琴，我可以仔细看看。
我明白是什么原因造成的。返回部门 ID 的服务是 $http 服务，因此它在控制器中最后被调用，并且图表的代码在此之前执行。那么有没有办法在执行图表代码之前获取这个值。
嗯，它是异步的，所以你必须想办法在你的 http 调用之后通过使用 promise 来渲染图表，这可能是也可能不是一种干净的方式，或者让您的服务通过在填充值后调用图表对象的 validateNow 方法来告诉图表重绘自身。
您能否详细说明您在评论中提到的第二部分。