Твердомеры Highcharts с разверткой - PullRequest
Новая
       16

Твердомеры Highcharts с разверткой

1 голос
/ 09 марта 2019

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

#container {
	margin: 0 auto;
	max-width: 400px;
	min-width: 380px;
}
<script src="https://code.highcharts.com/highcharts.js"></script>

<script src="https://code.highcharts.com/modules/data.js"></script>
<script src="https://code.highcharts.com/modules/drilldown.js"></script>

<script src="https://code.highcharts.com/highcharts-more.js"></script>
<script src="https://code.highcharts.com/modules/solid-gauge.js"></script>


<div id="container"></div>

(Нажатие на один из дисков измерительного прибора для отображения развертки должно отобразить гистограмму, но небольшая часть дисков измерительного прибора выходит.)

https://jsfiddle.net/JMarcia/5c1wv8t0/42/

1 Ответ

0 голосов
/ 11 марта 2019

Развертка от solid-gauge до других типов серий не поддерживается. Вы можете создать новую диаграмму или переключить видимость контейнеров в событии щелчка точки для имитации развертки. 

var solidGaugeOptions = {
    ...,

    plotOptions: {
        solidgauge: {
            ...,
            events: {
                click: function() {
                    document.getElementById('back').style.display = "block";
                    Highcharts.chart('container', columnsOptions);
                }
            }
        }
    }
}

var columnsOptions = {
    series: [...]
}

Highcharts.chart('container', solidGaugeOptions);

document.getElementById('back').addEventListener('click', function() {
    this.style.display = "none";
    Highcharts.chart('container', solidGaugeOptions);
});

Живая демоверсия: https://jsfiddle.net/BlackLabel/4n7tvdLh/

Справочник по API: https://api.highcharts.com/class-reference/Highcharts#.chart

...