Question

我正在使用角度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
                    }
                ]
            }
        ];

先谢谢

Answer 1

您可以直接从数据数组中获取最小值和最大值

＆＃13;

const 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
    }
  ]
}];

console.log(Math.max(...data[0].values.map(v=>v.label)));
console.log(Math.min(...data[0].values.map(v=>v.label)));

＆＃13;

如何知道nvd3图表中图表轴的最小最大值

1 个答案: