I have the following code for a line chart using nvd3:
$scope.sumAssuredOptions = { chart: { type: 'lineChart', height: 450, margin: { top: 20, right: 40, bottom: 70, left: 75 }, x: function (d) { return d.x; }, y: function (d) { return d.y; }, useInteractiveGuideline: true, dispatch: { stateChange: function (e) { console.log("stateChange"); }, changeState: function (e) { console.log("changeState"); }, tooltipShow: function (e) { console.log("tooltipShow"); }, tooltipHide: function (e) { console.log("tooltipHide"); } }, xAxis: { axisLabel: '', tickValues: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11], tickFormat: function (d) { return $scope.labels[d]; }, }, yAxis: { axisLabel: '', axisLabelDistance: 15, tickFormat: function (d) { return $scope.shortenLargeNumber(d); } }, yDomain: [$scope.sumAssuredMinY - ($scope.sumAssuredMaxY - $scope.sumAssuredMinY) * 0.05, $scope.sumAssuredMaxY + ($scope.sumAssuredMaxY - $scope.sumAssuredMinY) * 0.05], xDomain: [0 - (11 - 0) * 0.05, 11 + (11 - 0) * 0.05] }, title: { enable: false, text: '' } };
I have pre-calculated and assigned the $scope.sumAssuredMinY and $scope.sumAssuredMaxY values in another function.
$scope.sumAssuredMaxY = Math.max.apply(Math, sumAssuredReturnType.YearOnYearSumAssuredList[0]); $scope.sumAssuredMinY = Math.min.apply(Math, sumAssuredReturnType.YearOnYearSumAssuredList[0]);
I am just passing these variable in the yDomain. When I console log these 2 values for example in the y-axis, I can see that they are correct.
yAxis: { axisLabel: '', axisLabelDistance: 15, tickFormat: function (d) { console.log($scope.sumAssuredMaxY); console.log($scope.sumAssuredMinY); return $scope.shortenLargeNumber(d); } }
Only issue is that in the yDomain, the vaules are not being passed correctly.
When I hardcode the yDomain values, the graph is generated.
yDomain: [353810308 - (375913419 - 353810308) * 0.05,375913419 + (375913419 - 353810308) * 0.05]
Why is the yDomain not taking the variable values directly?