Highcharts 直方图钻取：设置钻取选项 + 第一列和最后一列截止

如何解决Highcharts 直方图钻取：设置钻取选项 + 第一列和最后一列截止

我有一个有 3 个难度的游戏，我在第一张图中显示了它们的平均值。现在我想使用向下钻取来显示直方图中每个难度的分数分布。我设法让这个工作，但我有两个问题。首先，我使用更新来更改向下钻取图的设置，但随后这些设置也会更改为第一个图，因此我想知道这样做的更好方法是什么。 我的另一个问题是，在我的直方图中，第一列和最后一列被切成两半，只显示了一半，但我似乎找不到解决这个问题的方法。我尝试了 min- 和 maxPadding 但这没有用。

chart of the tree difficulties Histogram of one difficulty

https://jsfiddle.net/vlovlo/sng4jwv8/36/ 这是我的代码

Highcharts.chart('skippedPatients',{
    chart: {
        events: {
            drilldown: function (e) {
                this.update({
                    title: {text: "Skipped patient: " + e.point.name},xAxis:{
                        title:{text: "Nr of skipped patients"},tickmarkPlacement: 'on',},yAxis:{title:{text: "Nr of players"}},plotOptions:{series:{pointPlacement: 'on'}},});

                if (!e.seriesOptions) {
                    var chart = this,drilldowns = {
                            'Histogram: Easy': {
                                name: 'Easy',type: 'histogram',baseSeries: 'avgSkippedEasy'
                            },'Easy': {
                                id: 'avgSkippedEasy',visible: false,type: 'column',data: skippedPatientsList
                            }
                        },series = [drilldowns['Histogram: ' + e.point.name],drilldowns[e.point.name]];

                    chart.addSingleSeriesAsDrilldown(e.point,series[0]);
                    chart.addSingleSeriesAsDrilldown(e.point,series[1]);
                    chart.applyDrilldown();
                }

            }
        }
    },title: {
        text: 'Skipped patients'
    },xAxis: {
        type: 'category',legend: {
        enabled: false
    },plotOptions: {
        series: {
            borderWidth: 0,dataLabels: {
                enabled: true
            },histogram: {
            binWidth: 1
        }
    },series: [{
        name: 'Averages per difficulty',colorByPoint: true,data: [{
            name: 'Easy',y: 5,drilldown: true
        },{
            name: 'Moderate',y: 2,{
            name: 'Hard',y: 4,drilldown: true
        }]
    }],drilldown: {
        series: []
    }
});

解决方法

您应该将初始选项定义为变量，并在 drillup 回调中再次附加它们，因为您使用更改的初始选项进行了图表更新。

演示：https://jsfiddle.net/BlackLabel/5d1atnh7/