在AngularJs

时间:2016-07-18 17:22:49

标签: angularjs amcharts

我正在使用amCharts显示一些数据并在我的init函数中调用它。以下是我的代码:

export default class ACtrl {
    constructor($scope, $http, $state) {



        var sampleCharts = function () {
            let sampleChart;
            let sampleBarGraph;
            let sampleLine;

            const writeAlarmsample = data => {
                const {
                    total,
                    users
                } = data;

                // Set cumulative percentage
                let runningTotal = 0;

                users.forEach(user => {
                    runningTotal += user.assetAvailability;
                    user.cumulativePercentage = runningTotal / total * 100;
                });

                sampleChart.dataProvider = users;
                sampleChart.write('userAvailability');
                sampleChart.validateData();
            };

            function handleClick(event){
                $state.go("app.userdetails", { userID: event.item.category });

            }

            // Alarm sample
            AmCharts.ready(() => {
                sampleChart = new AmCharts.AmSerialChart();
                sampleChart.categoryField = "assetId";

                //add click listener
                sampleChart.addListener("clickGraphItem", handleClick);

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

                var yAxis2 = new AmCharts.ValueAxis();
                yAxis2.position = "right";
                sampleChart.addValueAxis(yAxis2);

                sampleBarGraph = new AmCharts.AmGraph();
                sampleBarGraph.valueField = "userAvailability";
                sampleBarGraph.type = "column";
                sampleBarGraph.fillAlphas = 1;
                sampleBarGraph.lineColor = "#f0ab00";
                sampleBarGraph.valueAxis = yAxis;
                sampleChart.addGraph(sampleBarGraph);

                sampleLine = new AmCharts.AmGraph();
                sampleLine.valueField = "cumulativePercentage";
                sampleLine.type = "line";
                sampleLine.lineColor = "#cb0044";
                sampleLine.valueAxis = yAxis2;
                sampleChart.addGraph(sampleLine);

                sampleChart.write('userAvailability');

                $http.get(constants.LOCAL_HOST+"/dashboard/users")
                    .then(response => writeAlarmsample(response.data));
            });
        };

        $scope.init = function() {
            availabilityCharts();
        };



        })
    }

当我点击刷新按钮时图表加载正常,但是当页面第一次加载时它们没有被加载。我还有一个刷新按钮,调用该函数加载图表,即使没有加载图表。如果我点击其中一个图表项目,它会将我带到详细信息页面,当我回到此页面时,图表不会加载。我必须再次点击刷新才能加载图表。任何人都可以让我知道这个问题的原因以及我如何解决它。

0 个答案:

没有答案