【发布时间】:2017-04-24 10:31:01
【问题描述】:
我正在使用角度 nvd3 图表并希望检索 x 轴最小值和最大值,以便当我单击自定义下一个按钮时,将加载新的 x 轴值并且图表将显示下一个值范围.. .
我被困在这里,因为我找不到获取当前 x 轴的最小最大值的方法
这是我的代码...
angular.module('sbAdminApp', ['nvd3'])
.controller('DemoCtrl', ['$rootScope', '$scope', '$timeout', function
($rootScope, $scope, $timeout){
$rootScope.curlabel = "year";
$scope.curformat = "mon"
$scope.options = {
chart: {
type: 'discreteBarChart',
height: 450,
staggerLabels: false,
x: function(d){return d.label;},
y: function(d){return d.value;},
showValues: true,
valueFormat: function(d){ return d3.format(',.4f')(d); },
dispatch: {
tooltipShow: function(e){ console.log('! tooltip SHOW !')},
tooltipHide: function(e){console.log('! tooltip HIDE !')},
beforeUpdate: function(e){ console.log('! before UPDATE !')}
},
discretebar: {
dispatch: {
//chartClick: function(e) {console.log("! chart Click !")},
elementClick: function(d) {
//console.log(d);
var labelValue = d.data.label;
$scope.newchart($rootScope.curlabel, labelValue);
}
}
},
zoom: {
enabled: true,
scaleExtent: [1, 10],
useFixedDomain: false,
useNiceScale: false,
horizontalOff: false,
verticalOff: true,
unzoomEventType: 'dblclick.zoom'
}
}
};
$scope.data = [
{
key: "Cumulative Return",
values: [
{
"label" : 2010 ,
"value" : -29.765957771107
} ,
{
"label" : 2011 ,
"value" : 0
} ,
{
"label" : 2012 ,
"value" : 32.807804682612
} ,
{
"label" : 2013 ,
"value" : 196.45946739256
} ,
{
"label" : 2014 ,
"value" : 0.19434030906893
} ,
{
"label" : 2015,
"value" : -98.079782601442
} ,
{
"label" : 2016 ,
"value" : -13.925743130903
} ,
{
"label" : 2017 ,
"value" : -5.1387322875705
},
{
"label" : 2018 ,
"value" : -5.1387322875705
},
{
"label" : 2019 ,
"value" : -5.1387322875705
}
]
}
];
提前致谢
【问题讨论】:
-
您的数据在哪里?您不能简单地获取数据数组的最小值和最大值吗?
-
数据将是一系列年份作为 x 轴和一些值作为 y 轴,但我无法在图表中一次显示整个数据所以我将一次加载有限的数据并且然后是下一个按钮上的其余数据
-
然后获取这部分的最小值和最大值数据
-
我的数据是这样的: $scope.data = [{ key: "Cumulative Return", values: [{ "label" : "2010" , "value" : -29.765957771107 } , { “标签”:“2011”,“价值”:0 }]}
-
然后获取
$scope.data.values的最小值和最大值
标签: javascript angularjs charts nvd3.js