在高图Y轴标题线标签被切断

时间:2016-03-11 06:28:18

标签: javascript charts highcharts bar-chart

我想创建条形图,添加自定义水平线以显示平均基准。此外,还在这些行上添加了标签以显示基准标题。我将线条标签切掉,如下图所示。 Barchart

此外,如果绘图线值超出绘制的范围,则绘制线隐藏。如何在高图中处理这种情况?以下是我正在使用的代码。



$(function () { 
    $('#chartContainer').highcharts({
    	credits: {
    	    enabled: false
    	},
    	colors: ['#3C791D','#BEBEBE','#7F7F7F'],
        chart: {
            type: 'column'
        }, 
        title: {
            text: ''
        },
        xAxis: {
            categories: ['Great', 'Neutral', 'Bad']
        },
        yAxis: {
            title: {
                text: ''
            },
            plotLines:[{
                value:80,
                color: '#000000',
                width:2,
                zIndex:4,
                label:{
                	text:'XYZ Average: 80%',
                	align: 'right'
                }
            },{
                value:60,
                color: '#000000',
                width:2,
                zIndex:4,
                label:{
                	text:'PQR Average: 60%',
                	align: 'right'
                }
            }]
        },
        legend: {
        	enabled : false
        },
        plotOptions: {
            column: {
                dataLabels: {
                    enabled: true,
                    formatter:function() {
                    	return this.y + '%';
                    }
                },
                colorByPoint: true,
                enableMouseTracking: false
            }
        },
        series: [{
        	type: 'column',
        	name: "s",
            data: [70, 10, 40]
        }]
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<html>
<body>
<div id="chartContainer"></div>
</body>
</html>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

设置图表的高度以及Y轴的最大值

chart: {
       eight:600
},
yAxis:{
         min: 0,
         max: 100
}