如何克服highcharts样条曲线中的重叠系列线

Question

我有一个使用highcharts实现的趋势图，数据通过json动态加载。图表正确显示数据，但系列线，数据标签和符号在给定数据点处相互重叠。我该如何克服这个问题？

找到Fiddle的链接 - https://jsfiddle.net/ashanwijenayake/ft0ke201/

Screenshot

function renderTrendChart(){                                
    $("#trendChartContainer").highcharts({    
        title: {
            text: 'Indicator Vs Action Trend Chart',
            x: -20 
        },
        xAxis: {
            categories: trendChartCategoies
        },
        yAxis: {
            minRange: 1,
            allowDecimals: false,
            min: 0, 
            title: {
                text: 'Cases Identified'
            },
            plotLines: [{
                value: 0,
                width: 1,
                color: '#808080'
            }]
        },
        plotOptions: {
            series: {               
                pointPadding: 10,
                groupPadding: 10,
                cursor: 'pointer',
            }
        },
        series: [{"name": "Pneumothorax", "data": [ { "y": 1, "marker": { "symbol": "text:" }, "dataLabels": { "x": -10, "y": -2, "enabled": true, "format": "2", "style": { "fontWeight": "bold", "fontSize": "12px" } } },{ "y": 2, "marker": { "symbol": "text:" }, "dataLabels": { "x": -10, "y": -2, "enabled": true, "format": "2", "style": { "fontWeight": "bold", "fontSize": "12px" } } } ], "id": "Pneumothorax" },{"name": "Respiratory", "data": [ 0,{ "y": 1, "marker": { "symbol": "text:" }, "dataLabels": { "x": -10, "y": -2, "enabled": true, "format": "1", "style": { "fontWeight": "bold", "fontSize": "12px" } } } ], "id": "Respiratory" },{"name": "Exsanguination", "data": [ 0,{ "y": 2, "marker": { "symbol": "text:" }, "dataLabels": { "x": -10, "y": -2, "enabled": true, "format": "3", "style": { "fontWeight": "bold", "fontSize": "12px" } } } ], "id": "Exsanguination" }]
    });
}