Highchart：如何更改 angularjs 控制器内的 y-axis 标题文本？

Question

我已经创建了 highchart 指令

App.directive('hcChart', function ($parse) {
    'use strict';
    return {
        restrict: 'E',
        replace: true
        ,
        template: '<div><div class="chart"></div></div></div>',
        link: function (scope, element, attrs) {
            attrs.chart = new Highcharts.chart(element[0], {

                xAxis: {
                    title: {
                        text: "Date"
                    },
                    type: 'datetime'
//                    labels: {
//                        step: 24
//                    }
//                    ,
//                     tickInterval:  2  
                },
                yAxis: {
                    title: {
                        text: "Value"
                    }
                },
                dataLabels: {
                    enabled: true
                }
                ,
                title: {
                    text: ""
                },
                chart: {
                    opacity: 0.51,
                    backgroundColor: "white",
//                    plotBackgroundColor: 'rgba(0, 0, 0, 0.7)',
                    plotBackgroundColor: 'white',
//                    width: 1600,
                    height: 800,
                    zoomType: 'x',
                    resetZoomButton: {
                        position: {
                            x: -140,
                            y: 0
                        }
                    }
                },
                tooltip: {
                    crosshairs: {
                        width: 3,
                        color: 'black',
                        dashStyle: 'shortdot'
                    }

如何更改 y-axis 控制器内的标题文本。因为我想为不同的选择显示不同的单位。

在控制器内部，我使用 $scope.myseries 作为数据，使用 $scope.categories 作为 x-axis 日期时间。

html代码

<hc-chart   id="container" categories="{{myCategories}}" series="{{mySeries}}">Placeholder for generic chart </hc-chart>

如何使用$scope来更新y-axis？我尝试使用

$scope.yAxis[0].setTitle({text : "abc"})

但它的抛出错误。未定义属性。请帮忙！

Answer 1

要在 angularjs 控制器中更改 yAxis 标题，我们需要设置它的属性:

                    Highcharts.charts[0].yAxis[0].setTitle({
                    text: $scope.NAME
                    });

Highchart：如何更改 angularjs 控制器内的 y-axis 标题文本？

Highchart: How to change y-axis title text inside angularjs controller?

highcharts

angularjs

angularjs-directive