简体   繁体   中英

HightCharts: How to align pie chart positions to right or left corner of the container

How can I align the pie chart in the highcharts to the right end or left end in the container? i have notice that center:[] property works using percentage but getting some position issues while resizing the container. Please check the below fiddle link.

fiddle

Highcharts.chart('container', {
chart: {
    plotBackgroundColor: null,
    plotBorderWidth: null,
    plotShadow: false,
    type: 'pie'
},
title: {
    text: 'Browser market shares in January, 2018'
},
tooltip: {
    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
},
plotOptions: {
    pie: {
        allowPointSelect: true,
        cursor: 'pointer',
        dataLabels: {
            enabled: false
        },
        showInLegend: true
    }
},
series: [..]

});

You can use style property for the chart. Please look at the attached example:

chart: {
    plotBackgroundColor: null,
    width: 200,
    height: 300,
    type: 'pie',
    style: {
        'float': 'right'
    }
},

Live demo: https://jsfiddle.net/BlackLabel/2at3g47f/

API Reference: https://api.highcharts.com/highcharts/chart.style

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM