Диаграмма паутины Highchart

Я сделал диаграмму пауков, используя highcharts, но точки данных сместились в крайнее левое положение. Я следую этому пример. Вот мой код:

<div id="container2" style=" position: relative;"></div>

<script>
    $(function () {

        $('#container2').highcharts({

            chart: {
                polar: true,
                type: 'line',
                margin: 0
            },

            exporting: {
                enabled: false,
                buttons: {
                    enabled: false
                }
            },

            title: {
                text: '&nbsp',
                x: -80,
                useHTML: true
            },

            pane: {
                size: '70%'
            },

            xAxis: {
                categories: ['Math', 'Comp. Sci', 'Science', 'Social Sci.', 'English', 'Hindi'],
                tickmarkPlacement: 'on',
                lineWidth: 0,
                labels: {
                    align: 'center',
                    distance: 43
                }
            },

            yAxis: {
                gridLineInterpolation: 'polygon',
                lineWidth: 0,
                min: 0,
                endOnTick: true,
                showLastLabel: true,
                tickPositions: [0.2, 0.4, 0.6, 0.8, 1.0]
            },

            tooltip: {
                shared: true,
                headerFormat: '<span style="font-size: 12px">{point.key}:</span>&nbsp;&nbsp;<b>{point.y:,.2f}</b>',
                pointFormat: '',
                useHTML: true
            },

            legend: {
                enabled: true,
                align: 'right',
                verticalAlign: 'top',
                y: 30,
                layout: 'vertical'
            },

            series: [{
                name: 'Grade Distribution',
                data: [.8, .95, .7, .35, .6, .3],
                pointPlacement: 'on',
                color: 'black',
                fillOpacity: 0.2
            }]

        });
    });

Я искал мешающий css в своем коде, но ничего не нашел. Любая идея, что может быть причиной этого?

введите здесь описание изображения


person Akk    schedule 04.01.2017    source источник
comment
Воссоздайте проблему на jsfiddle. Размещенный вами код работает jsfiddle.net/uh1obkte, поэтому трудно догадаться, что происходит на вашей стороне.   -  person morganfree    schedule 04.01.2017


Ответы (2)


Нет проблем с тем же кодом,

<div id="container2" style="min-width: 400px; max-width: 600px; height: 400px; margin: 0 auto"></div>

ДЕМО

person Sajeetharan    schedule 04.01.2017

Возможно, у вас старая версия highchart. Загрузка последней версии решила проблему для меня.

person andresouris    schedule 21.06.2018