Question

我正在使用Highcharts绘制样条曲线。这很好用。我正在使用辅助系列（列）来获取其他数据。我的问题是：如何设置列高度与样条曲线匹配。

到目前为止，我已经这样做了：jsfiddle

列几乎有我需要的高度，但不是全部。

有可能吗？

相关代码：

$('#chart').highcharts({
    title: {text: 'Chart'},
    chart: {
        type: 'spline'
    },
    xAxis: {
        title: {
            text: 'X-Axis'
        }
    },
    yAxis: {
        title: {
            text: 'Y-Axis'
        },
        labels: {
            enabled: false
        }         
    },
    series: [{
        name: 'Chart',
        data: chdata,
        marker: {
            enabled: false
        },
    }],
    legend: {
        enabled: false
    }
});

var chartObj = Highcharts.charts[$('#chart').attr('data-highcharts-chart')];
var d = [];
for(var i = 0; i < ldata.length; i++) {
    d.push([ldata[i],getYValue(chartObj,0,getClosest(ldata[i],bdata[0]))]);
}

chartObj.addSeries({
    type: 'column',
    pointWidth: 1,
    borderWidth: 0,
    data: d
});

我甚至尝试使用plotLines，但它有整个图表的高度。

谢谢，鲍尔泰克

Answer 1

不是绘制最近点的高度，而是绘制条形图两侧点的平均高度。

如果您在两侧各点之间的线上计算出线条最佳拟合，则可以更接近。类似的东西：

function getY(xVal,points) {

var higher = 0;
var lower=0;
for(var i=0;i<points.length;i++){
    if (points[i][0] > xVal) {
        higher=i;
        lower=i-1;
        break;
    }
}

return points[lower][1] + ((points[higher][1]-points[lower][1])*(xVal-points[lower][0])/(points[higher][0]-points[lower][0]));
};

http://jsfiddle.net/5h471o3d/

如何在Highcharts中将列高与样条曲线匹配

1 个答案: