0

我对使用 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>

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

这是它目前的样子

4

1 回答 1

0

移动你的传奇怎么样?

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

演示

于 2012-07-27T01:41:35.797 回答