我正在尝试在轴上显示刻度值。以下是动态获取数据并生成柱形图的代码。
以下代码存在问题,未显示h轴dynamicTicks,在h轴上显示的是cData中{“ v”:i,“ f”:hAxisValue}的f:属性中给出的值。在演示示例https://plnkr.co/edit/G5wUQjVZ0512RvqltIqm?p=preview中也是如此,但是当在我的本地应用程序中使用时,它不会在haxis上显示刻度值。有什么建议么?
app.controller('myController', ['$scope', '$uibModal', 'MyService', function ($scope, $uibModal, MyService) {
$scope.chart = {};
$scope.chart.type = "ColumnChart";
$scope.chart.displayed = false;
var dynamicTicks = [];
$scope.chart.options = {
focusTarget: 'category',
"fill": 20,
"displayExactValues": true,
"isStacked": 'true',
tooltip: {text: 'value',textStyle: {fontName: '"Arial"'}},
hAxis: {
titleTextStyle: {bold: 'true'},
slantedText: false,
ticks: dynamicTicks
},
};
$scope.chart.view = {
columns: [0, 1, 2, 3]
};
$scope.chart.data = {
"cols": [
{id: "label", label: "Label", type: "string"},
{id: "count", label: "Count", type: "number"},
{id: "pizza", label: "Pizza", type: "number"},
{id: "softDrink", label: "SoftDrink", type: "number"},
]
};
$scope.loadMyChart = function () {
MyService.getChartData().then(
function (response) {
$scope.myResponse= response;
//check for error
var count = 0;
var pizza = 0;
var softDrink = 0;
var myRows = [];
$scope.chart.data.rows = {};
var i = 0; var cData=[];
angular.forEach($scope.myResponse, function (value, key) {
count = value.myData.count;
pizza = value.myData.pizza;
softDrink = value.myData.softDrnk;
hAxisValue = value.myData.title;
cData = {
"c": [{"v": i, "f": hAxisValue}, {"v": passsed},
{"v": failed},
{"v": notExecute}, {"v": key}]
};
myRows.push(cData); i++;
});
alert("cData.length " + i);
//assign the haxis ticks values
for (var j = 0; j < i; j++) {
alert("in for" + j + "Series" + (j+1)); //This alert is being executed..
dynamicTicks.push({
v: j, /*cData[j].c[0].v - when this is used, it is showing the error angular.min.js:sourcemap:119 TypeError: Cannot read property 'c' of undefined and chart is not displayed*/
f: 'Series ' + (j + 1)
});
}
$scope.chart.data.rows = myRows;
},
}
$scope.loadMyChart();
}]);
最佳答案
建立刻度后,需要将刻度分配给选项...
for (var j = 0; j < i; j++) {
alert("in for" + j + "Series" + (j+1)); //This alert is being executed..
dynamicTicks.push({
v: j, /*cData[j].c[0].v - when this is used, it is showing the error angular.min.js:sourcemap:119 TypeError: Cannot read property 'c' of undefined and chart is not displayed*/
f: 'Series ' + (j + 1)
});
}
$scope.chart.options.hAxis.ticks = dynamicTicks;
关于javascript - 无法在轴上显示刻度线,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/46118381/