在Highcharts区域图表中添加线和填充之间的空间

Question

我目前正在使用Highcharts图形库，我试图在线和面积图的填充之间添加空格，似乎无法找到方法。对此有任何解决方案/黑客攻击吗？

实际highcharts.js javascript黑客欢迎。

这就是我所拥有的：

这是我想要达到的目标：

并不是说它会有所帮助，但这是我目前的代码：

var chart = new Highcharts.Chart({
    chart: {
        type: 'area',
        renderTo: 'test-trending-chart',
        backgroundColor:'#5473B4',
        spacingTop: 0,
        spacingBottom: 0,
        spacingLeft: 0,
        spacingRight: 0,
        marginLeft: -3,
        marginRight: -3
    },
    credits: {
        enabled: false
    },
    title: {
        text: ""
    },
    tooltip: {
        enabled: false
    },
    legend: {
        enabled: false
    },
    plotOptions:{
        area: {
            shadow: false,
            animation: false,
            states: {
                hover: {
                    enabled: false
                }
            },
            marker: {
                lineColor: '#5473B4',
                lineWidth: 2,
                radius: 5
            },
            lineWidth: 3,
            fillColor: {
                linearGradient: [0,0,0,100],
                stops: [
                    [0,'rgba(255,255,255,0.5)'],
                    [1,'rgba(255,255,255,0.75)']
                ]
            }
        }
    },
    series: [{
        color: 'white',
        data: [36,40,23,42,65]
    }],
    xAxis: {
       lineWidth: 0,
       minorGridLineWidth: 0,
       lineColor: 'transparent',        
       labels: {
           enabled: false
       },
       minorTickLength: 0,
       tickLength: 0
    },
    yAxis: {
        lineWidth: 0,
       minorGridLineWidth: 0,
       gridLineWidth: 0,
       lineColor: 'transparent',        
       labels: {
           enabled: false
       },
       minorTickLength: 0,
       tickLength: 0,
       title: {
            text: ""
        }
    }
});

Answer 1

编辑：一个更优雅的解决方案，不需要您编辑highcharts.js，而是使用原型来扩展Highcharts。在实例化任何图形之前，请将以下Javascript代码段添加到代码中：

Highcharts.Series.prototype.drawGraph = (function (func) {
        return function () {
            func.apply(this, arguments);
            if (typeof this.options.areaPadding !== "undefined"){
                for (i=2;i<this.areaPath.length;i+=3){
                    this.areaPath[i]+=this.options.areaPadding;
                }
            }
        };
    } (Highcharts.Series.prototype.drawGraph));

然后像这样使用areaPadding参数在行和区域之间添加空格：

var chart = new Highcharts.Chart({
    plotOptions:{
        area: {
            areaPadding: 4   
        }
    }
});

在此处查看此行动：http://jsfiddle.net/AAQEq/