Highcharts диаграмма полярной розы ветров с сегментами в форме трапеции

1

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

Изображение 174551

Я смог интегрировать объект highcharts в мое приложение, используя оболочку, предоставленную JoeKuan

Однако я не вижу в документации по высоким стандартам, как я могу настроить столбцы полярной диаграммы в прямые сегменты, как показано на изображении.

Вот скрипка полярной диаграммы, поскольку она работает в настоящее время. Fiddle

Highcharts.chart('container', {
    data: {
        table: 'freq',
        startRow: 1,
        endRow: 17,
        endColumn: 7
    },

    chart: {
        polar: true,
        type: 'column'
    },

    title: {
        text: 'Wind rose for South Shore Met Station, Oregon'
    },

    subtitle: {
        text: 'Source: or.water.usgs.gov'
    },

    pane: {
        size: '85%'
    },

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

    xAxis: {
        tickmarkPlacement: 'on'
    },

    yAxis: {
        min: 0,
        endOnTick: false,
        showLastLabel: true,
        title: {
            text: 'Frequency (%)'
        },
        labels: {
            formatter: function () {
                return this.value + '%';
            }
        },
        reversedStacks: false
    },

    tooltip: {
        valueSuffix: '%'
    },

    plotOptions: {
        series: {
            stacking: 'normal',
            shadow: false,
            groupPadding: 0,
            pointPlacement: 'on'
        }
    }
});

Вся помощь была высоко оценена

Лиза

Теги:
extjs
extjs6.2
highcharts

1 ответ

0
Лучший ответ

Вы хотите type: 'area' для достижения этой визуализации.

Highcharts.chart('container', {
    data: {
        table: 'freq',
        startRow: 1,
        endRow: 17,
        endColumn: 7
    },

    chart: {
        polar: true,
        type: 'area'
    },

http://jsfiddle.net/0mb1s1jd/1/

  • 0
    Большое вам спасибо, это именно то, что я был после :-)

Ещё вопросы

Сообщество Overcoder
Наверх
Меню