Highcharts的图表大小的动态变化

Question

我对使用Highcharts制作的图表大小有疑问。 为了更好地理解，我附上了当前情况的截图。 我希望所有的馅饼实际上都是相同的尺寸，它们应该是水平对齐的。由于值是动态的，我不能通过试验和误差将图表容器的高度设置为正确的大小。

以下是一个图表和相关容器的代码：

var auftrag;
$(document).ready(function() {
    auftrag = new Highcharts.Chart({
        chart: {
            renderTo: 'angebot-container',
            height: 400,
            plotBackgroundColor: '#f5f5f5',
            backgroundColor: '#f5f5f5',
            plotBorderWidth: null,
            plotShadow: false
        },
        credits: {
            enabled: false
        },
        title: {
            text: ''
        },
        tooltip: {
            formatter: function() {
                return '<b>'+ this.point.name +'</b>: '+ Highcharts.numberFormat(this.y, 0, ',', '.') +' €';

            },
            positioner: function () {
                return { x: 3, y: 40 };
            }
        },
        legend: {
            layout: 'vertical'
        },
        plotOptions: {
            pie: {
                allowPointSelect: true,
                cursor: 'pointer',
                dataLabels: {
                    enabled: false
                },
                showInLegend: true
            }
        },
        series: [{
            type: 'pie',
            name: '',
            data: [
                <?php
                foreach ($offerPie as $offer) {
                    echo '[\'' . utf8_encode(shorten_word($offer['company'], 20, '...')) . '\', ' . $offer['summe'] . '],';
                }
                ?>
            ]
        }]
    });
});

，这是容器的标记：

<div class="chart" id="angebot-container" style="min-width: 250px; margin: 0 auto"></div>

我尝试了几件事，但我甚至没有接近我想要的东西。 问题是，图例中的项目可以更改，图例的高度会更改实际饼图的高度和宽度。

Answer 1

如何移动你的传奇？

...
legend: {
    layout: 'vertical',
    align: 'right',
    verticalAlign: 'top',
    y: 100
},
...

demo