Question

我搜索了API以查找是否有办法在mouseup事件后获取句柄x值，但我找不到任何东西。我唯一能找到的是如何获取主系列的值，而不是导航器本身的值。有人知道获得这些价值的方法吗？这是我正在使用的一些示例代码，其底部有一个导航滑块供您随意使用。我想从导航器中拖动一个句柄，一旦我释放它，就会弹出一个带有x值的警告消息。

http://jsfiddle.net/fqptH/2/

var highPoint=0;
var highCount=0;

$(function() {   
function getPoints() {
    var dataPoints = [];
    for (var i=0; i<=100; i++) {
        if (i == highPoint && highCount < 20) {
            dataPoints[i]=[i,8];
            highCount++;
        } else {
            var randomnumber=Math.floor(Math.random()*2);
            dataPoints[i]=[i,randomnumber];
        }
        if (highCount == 20) { highCount = 0; }
    }
    if (highPoint == 100) { highPoint=0; }
    if (highCount == 19) { highPoint++; }
    return dataPoints;
} 

var chart = new Highcharts.StockChart({
    chart: {
        renderTo: 'container'
    },
    navigator : {
        series: {
            //data: [[1,1],[2,2],[3,1]]
            data: getPoints()
        }
    },
    series: [{
        data: [[1,1],[2,2],[3,1]]
        //data: getPoints()      
    }]
});

function update() {
    //chart.series[0].setData(getPoints());
    setTimeout(update, 100);        
}
update();
});

Answer 1

绘制绘图后尝试此操作：

// left handle
$(Highcharts.charts[0].scroller.handles[0].element).mouseup(function(){
    var minPixel = Highcharts.charts[0].scroller.zoomedMin;
    alert(Highcharts.charts[0].scroller.xAxis.toValue(minPixel));
});

// right handle
$(Highcharts.charts[0].scroller.handles[1].element).mouseup(function(){
    var maxPixel = Highcharts.charts[0].scroller.zoomedMax;
    alert(Highcharts.charts[0].scroller.xAxis.toValue(maxPixel));
});

示例小提琴here。

Answer 2

我不确定这有多大帮助，但它可能会让你走上正轨：http://jsfiddle.net/fqptH/3/

xAxis: {
    events: {
        setExtremes: function(e) {
            console.log('<b>Set extremes:</b> e.min: '+ e.min +
                ' | e.max: '+ e.max + ' | e.trigger: ' + e.trigger);
        }
    }
},

当您移动手柄时，它似乎会反复触发，因此我不确定您何时知道它何时完成，然后触发弹出窗口。

Answer 3

借助@Mark提供的有用提示，我想出了以下内容。 toValue没有正确解析数字，但通过源查看，您可以使用.translate（value，true）执行非常类似的操作。这会将像素位置转换为轴值。

var scroller = Highcharts.charts[0].scroller;
var navMin = scroller.xAxis.translate(scroller.zoomedMin, true);
var navMax = scroller.xAxis.translate(scroller.zoomedMax, true);
alert('min: '+Math.round(navMin)+"\nmax: "+Math.round(navMax));

这是一个完整的jsfiddle示例：

http://jsfiddle.net/fqptH/9/

发生mouseup时获取highstock导航器句柄的x值

3 个答案: