高股票图表-日期范围按钮

Question

在我的应用程序中，我将angular Highstock用于图表。我有很多数据(几百万)，现在我想把现有的按钮设置为日期范围(1周，1个月，3个月，1年，全部)，还可以点击任何按钮向服务器发送一个新的请求不累积数据。例如，如果按下按钮"one week"，即服务器只检索一周的数据，如果单击一个按钮到一个月，则获取单个月的数据。我不想调用不必要的数据，如果我寻找一个月的数据，服务器会变慢，服务器会返回给我所有数据。下面是代码。提前感谢

> https://jsfiddle.net/tf7pr1ft/

Answer 1

感谢@Grzegorz Blachliński我解决了这个问题。以下是代码

 $scope.chartConfig1 = {


            xAxis: {
                ordinal: false,
                //za dodat date range postavit events i range selectors
                events : {
                afterSetExtremes: getDateRange //here i add my custom function
            }

            },
            yAxis: {
                plotLines: [{
                        color: '#FF0000',
                        width: 1,
                        value: 11.50,
                        label: {text: '11.50'}
                    }]

            },
            options: {
                chart: {
                    zoomType: 'x',
                    backgroundColor: 'rgba(255, 255, 255, 1)',
                    polar: true,
                    type: 'line',
                    borderRadius: 5

                },
                legend: {
                    enabled: true
                },
                rangeSelector: { 
            selected : 0, //here i defined default range 
             enabled: true,
                    inputStyle: {
            color: 'black'
        }
                },
                navigator: {
                    enabled: true
                }
            },
            series: [],
            title: {
                text: 'Solar and Battery voltage average'
            },
            useHighStocks: true
        },
        $scope.chartConfig1.series.push({
            id: 1,
            name: "Solar voltage average",
            data: $scope.data[0],
            tooltip: {
                valueDecimals: 2
            }
        },   {
            id: 2,
            name: "Battery voltage average",
            data: $scope.data[1],
            tooltip: {
                valueDecimals: 2
            }
        }
        );

下面是我的自定义函数

getDateRange = function (e) {
                        var date1 = new Date(e.min);
                        var date2 = new Date(e.max);
                        var timeDiff = Math.abs(date2.getTime() - date1.getTime());
                        var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));

                      $http.get(serviceBase + 'aaaaa/aaaaaa/' + $stateParams.klupaID + '/aaaaaaa?days=' + diffDays, function(data){
                  //ukoliko buden dodavat još koji config obavezno dodat broj koliko ih ima na i<=8
                  for (i=1; i<=8; i++){
                      $scope.chartConfigString = 'chartConfig' + i;
                     $scope.chartConfigString.series[0].setData(data);
                  $scope.chartConfigString.hideLoading(); 

                  }
                });
           };

现在我有了另一个问题，我想要有四个选择器(按钮)，1个月，3个月，1年和所有。我设置了默认的范围，当打开应用程序时，在1个月，这里有问题。另一个范围的按钮被禁用，因为我只能从url获得一个月的数据。我想要启用选择任何范围的所有按钮。Thnx