且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

Highcharts 水平同步图表

更新时间:2023-11-14 19:21:52

您可以在每个图表中找到坐标后编辑 event.chartX,添加:

You could edit event.chartX after coordiantes are found in each chart by adding:

event.chartX = (event.chartX+600) % 200;

添加 600 以避免负值和 % 通过 200 因为每个图表都有 200px 的宽度.示例:http://jsfiddle.net/fzda6z8p/

Adding 600 to avoid negative values and % by 200 because each chart has 200px of width. Example: http://jsfiddle.net/fzda6z8p/

相关代码部分:

$('#container').bind('mousemove touchmove touchstart', function (e) {
    var chart,
        point,
        i,
        event;

    for (i = 0; i < Highcharts.charts.length; i = i + 1) {
        chart = Highcharts.charts[i];
        event = chart.pointer.normalize(e.originalEvent); // Find coordinates within the chart

        event.chartX = (event.chartX+600) % 200;

        point = chart.series[0].searchPoint(event, true); // Get the hovered point
        if (point) {
            point.highlight(e);
        }
    }
});