Question

Highcharts是一个了不起的库，但是我需要以编程方式滚动图表，就像光标本身在x轴上盘旋一样。我能想到这一点的唯一方法就是选择积分，遗憾的是我在highcharts api文档中找不到允许我在选定点上放置十字准线/游戏头的选项。

我该怎么做？

Answer 1

这不是API的一部分，但您可以使用point.onMouseOver()来触发鼠标悬停事件：http://jsfiddle.net/15dzo23n/1/

示例：

var index = 0;
$('#container').highcharts({

    chart: {
        events: {
            load: hoverAnim
        }
    },
    tooltip: {
        crosshairs: true  
    },

    series: [{
        name: 'AAPL',
        data: [5, 10, 15, 12, 13, 14, 12, 1, 12, 1, 12, 12, 12, 1]
    }]
});



function hoverAnim(e) {
    var chart = this,
        points = chart.series[0].points,
        len = points.length;

    if (index < len) {
        chart.hoverSeries = chart.series[0];
        chart.hoverPoint = points[index];
        chart.pointer.runPointActions(e); //display crosshair
        points[index].onMouseOver(e); // display tooltip and set hover state
        index++;
        setTimeout(function () {
            hoverAnim.call(chart, e);
        }, 100);
    }
}

Answer 2

Pawel Fus有一个很好的答案，但我找到了一个更好的解决方案，当切换到不同的时间点时，它没有错误的滞后行为。此解决方案中也不需要事件。

           var chart = myElement.highcharts();

           function select(value) {
                    // Scroll to some time.
                    var axes = chart.axes;
                    for (var i = 0; i < axes.length; i ++) {
                        var axis = axes[i];
                        axis.drawCrosshair(null, chart.series[0].points[value])
                    }

                    for (i = 0; i < chart.series.length; i++) {
                        var series = chart.series[i];

                        // Unset last value
                        series.points[oldValue].setState('');

                        // Set new value
                        series.points[value].setState('hover');
                    }

                    oldValue = value;
            });

如何设置高图选择看起来像悬停？

2 个答案: