如何从JSON数据动态设置系列值和scale-x标签

时间:2019-04-08 09:13:19

标签: javascript angularjs zingchart

我试图将序列值和scaleX标签设置为图形,但是它没有显示动态数据,甚至无法调用函数changeReport()。

HTML

ng-init="selectedReport = dataList[0];extractSubsities(selectedReport)"></select> 
<div zingchart id="chart-1" zc-json="myData" zc-width="50%" zc-height="256px"></div>

MAINController.js

$scope.myData = {type : "line",plotarea : {"adjust-layout" : true
        },scaleX: {label : {text : "Above is chart of Finanial Ratio" 
            },labels : [ "2018", "2017", "2016","2015" ]},
        series : [ {"values" : [ 15, 18, 11 }, {
            "values" : [ 10, 11, 14 ]}, {
            "values" : [ 10, 11, 14 ]}, {
            "values" : [ 10, 11, 14 ]} };
$scope.chartData = angular.copy($scope.myData);
$scope.changeReport = function() {
        $window.alert("changeReport function called");
        $scope.selectedReport = dataList[0];
        $scope.dataElement = $scope.selectedReport .elements; 
$window.alert("SelectedReport"+selectedReport);
var lables = [];var val1 = {"values" : []};
var val2 = {"values" : []};var val3 = {"values" : []};var val4 = {"values" : []};

angular.forEach($scope.yearList, function(item, index) {
lables.puch(item.years)});

angular.forEach($scope.dataElement, function(item, index) {
    val1.values.push(item.year5);
    val2.values.push(item.year4);
    val3.values.push(item.year3);       val4.values.push(item.year2);});
// put selected values to the field that is used to render the chart
$scope.chartData["scaleX"].labels = labels;
$scope.chartData.series = [ year1, year2, year3, year4 ];

}

JSON数据

$scope.dataList = JSON.parse(result.data.json2);
{"json1":"[{\"years\":2018},{\"years\":2017},{\"years\":2016},{\"years\":2015}]","json2":"[{\"year5\":0.9535,\"year4\":0.7175,\"year3\":0.5058,\"year2\":0.5014,\"reportRang\":\"\",\"reportFormula\":\"Cost of goods Sold/Inventory\",\"reportTypeDetail\":\"Inventory Turnover\"},{\"year5\":4.5203,\"year4\":5.7248,\"year3\":5.5558,\"year2\":1.8688,\"reportRang\":\"\",\"reportFormula\":\" Sales/Account Receivables\",\"reportTypeDetail\":\"Account Receivable turn over\"}]"}

0 个答案:

没有答案