Graph 在Highcharts中选择缩放范围时获取x轴范围

我在海图中有一个条形图和一个样条曲线图。已在图形上启用缩放选项，因此当我选择特定区域时，它会放大。是否可以获取缩放的选定区域的x轴值？例如，如果x轴的日期从2015年1月1日到2015年1月30日，并且我选择了从2015年1月1日到2015年1月15日的范围进行缩放，则根据列的长度将x轴转换为1到15.3，而不是从2015年1月1日到2015年1月15日

提前感谢

您可以使用event.xAxis[0].min和event.xAxis[0].max作为索引

假设您的xaxis categories数组称为xaxis_数组，您可以使用类似于xaxis_数组[event.xaxis[0].min]的方法访问其值，并获取所需的原始值

希望对您有所帮助

您可以使用event.xAxis[0].min和event.xAxis[0].max作为索引

假设您的xaxis categories数组称为xaxis_数组，您可以使用类似于xaxis_数组[event.xaxis[0].min]的方法访问其值，并获取所需的原始值

---

希望有帮助

可能是一个可行的解决方案。我又想出了一个办法。非常感谢：Nikhiltikoo的另一种解决方案是什么。我又想出了一个办法。非常感谢：NikhilTikoo的另一条路是什么

$(function () {
    $('#container').highcharts({
        chart: {
            events: {
                selection: function (event) {
                    var text, label;
                    if (event.xAxis) {
                        text = 'min: ' + Highcharts.numberFormat(event.xAxis[0].min, 2) + ', max: ' + Highcharts.numberFormat(event.xAxis[0].max, 2);
                    } else {
                        text = 'Selection reset';
                    }
                    label = this.renderer.label(text, 100, 120)
                        .attr({
                            fill: Highcharts.getOptions().colors[0],
                            padding: 10,
                            r: 5,
                            zIndex: 8
                        })
                        .css({
                            color: '#FFFFFF'
                        })
                        .add();

                    setTimeout(function () {
                        label.fadeOut();
                    }, 3000);
                }
            },
            zoomType: 'x'
        },
        title: {
            text: '',
            style: {
                color: '#cc0000',
                fontWeight: 'bold'
            }
        },
        xAxis: {
            categories: [{{{xaxisLabel}}}],
            crosshair: true
        },
         yAxis: [{ /* Primary yAxis */
            labels: {
                format: '{value}%',
                style: {
                    color: '#cc0000'
                }
            },
            title: {
                text: 'Failure Percentage',
                style: {
                    color: '#cc0000'
                }
            }
        }, { /* Secondary yAxis */
            title: {
                text: 'Success Percentage',
                style: {
                    color: '#009900'
                }
            },
            max: 100, 
            labels: {
                format: '{value} %',
                style: {
                    color: '#009900'
                }
            },
            opposite: true
        }],
        labels: {
            items: [{
                html: '',
                style: {
                    left: '2px',
                    top: '18px',
                    color: (Highcharts.theme && Highcharts.theme.textColor) || 'black'
                }
            }]
        },
        credits: {
          enabled: false
        },
        series: [{
            type: 'column',
            name: 'Success',
            color: '#7deda2',
            yAxis: 1,
            tooltip: {
                pointFormatter: function(){
                  return "Success: " + this.y + "%" + "<br />" + "Success docs: " + toolTipSuccess[this.series.data.indexOf( this )] + "<br />";
                }
            },
            data: [{{barSuccess}}]
        }, {
            type: 'spline',
            name: 'Failure',
            tooltip: {
                pointFormatter: function(){
                  return "Failure: " + this.y + "%" + "<br />" + "Failure docs: " + toolTipFailure[this.series.data.indexOf( this )] + "<br />";
                }
            },
            data: [{{barFailure}}],
            marker: {
                lineWidth: 3,
                lineColor: Highcharts.getOptions().colors[8],
                fillColor: 'red'
            }
        }]
    });
});