如何在Highcharts中使用樣條線來匹配列高度

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 
}); 

我已經試過甚至的故事情節，但它有整個圖表的高度。

感謝， 鮑爾泰克

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/