Question

我是这个论坛的新手，有两个问题。

我只想知道我们是否可以在High Charts中消除轴后面的空白。我在API中找不到任何选项。
如何将系列标签单行显示。

由于我是新用户，我无法发布图片。

<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Highcharts Example</title>

    <script type="text/javascript"    src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script type="text/javascript">
$(function () {
var chart;
$(document).ready(function() {
    chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            type: 'bar'
        },
        title: {
            text: ''
        },
        xAxis: {
            gridLineWidth: 0,
            categories: ['Deutsche-FR Bank', 'Barelays-LDN', 'HSBC-SG', 'Citi-NY'],
            minorTickLength: 0,
            tickLength: 0,
            labels: {
                align: 'left',
                x: 2,
                y: 7,           
                color: '#2257D6',
                style: {
                    color: '#000',
                    font: '11px Trebuchet MS, Verdana, sans-serif'
                }
            },
            title: {
                text: null
            }
        },
        yAxis: {
            min: 0,
            gridLineWidth: 0,
            title: {
                text: '',
                align: 'high',
                color: '#333'
            },
            labels: {
                 enabled: false,
                overflow: 'justify'
            }
        },
        tooltip: {
            formatter: function() {
                return ''+
                    this.series.name +': '+ this.y +'';
            }
        },
        plotOptions: {
            bar: {
                borderWidth: 0.0,
                pointWidth: 22,
                dataLabels: {
                    enabled: false
                }                   
            },
            series: {
               shadow: false
            }
        },          
        legend: {
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'top',
            x: -100,
            y: 100,
            floating: false,
            borderWidth: 1,
            backgroundColor: '#FFFFFF',
            shadow: true,
            visible : false,
            enabled: false
        },
        credits: {
            enabled: false
        },
        series: [{
            name: 'Count',
            data: [82,323,245,350],
            color: '#2AAA00',
            borderWidth: 0,
            plotShadow: false,
            plotBorderWidth: 0
        }]
    });
});

});
    </script>
</head>
<body>
<script src="http://code.highcharts.com/highcharts.js"></script>

<div id="container" style="width:220px;height:145px;overflow:auto"></div>

</body>

Answer 1

How to get the series label in single line

为此，您需要使用属性Rotation作为

 rotation: 90

检查 API。

设置此属性也会回答您的问题1。

您可以在此处找到 Demo

如何在HIGHCHARTS中删除x轴和框架之间的间隙，并将系列标签设置为单行

1 个答案: