如何仅存在一个值时如何显示绘图线

时间:2015-06-19 10:52:45

标签: javascript highcharts

我的问题是在折线图中显示我的情节线并向下钻取。

每件事情都很好,但是当我在2015年(我每行只有1个值)时,我没有显示情节线。

我已在this post中了解此问题,但所有解决方案都不可接受,因为它们会禁用yAxis上的自动缩放。

以下是发生的事情:

正常图表(向下钻取之前)。它完美地运作:

The normal chart (before drill down)

2014年向下钻取的图表(我每行有4个值)。它完美地运作:

The chart with a drill down on 2014 (Where I have 4 values per line)

2015年向下钻取的图表(我每行有1个值)。绘图线不显示,两个点位于同一位置:

The chart with a drill down on 2015(Where I have 1 value per line)

以下是我初始化图表的方法:

/*Initialisation du chart*/
            chart = new Highcharts.Chart({
                chart: {
                    renderTo: instanceData.id,
                    type: 'line',
                    alignTicks: false
                },
                title: {
                    text: titre_drill
                },
                subtitle: {
                    text: soustitre_drill
                },
                legend:{
                    enabled:true
                },
                xAxis: {
                    type: 'category'
                },
                yAxis: [{
                    title: {
                        text: texte_ordonee_expedie,
                        style: {
                            color: color_expedie
                        }
                    },
                    plotLines : [{
                        value : seuil_expedie,
                        color : color_expedie,
                        dashStyle : 'shortdash',
                        width : 2,
                        label : {
                            text : ''
                        }
                    }],
                    labels: {
                        format: '{value} €',
                        style: {
                            color: color_expedie
                        }
                    },
                    gridLineColor: 'transparent'
                },
                {
                    title: {
                        text: texte_ordonee_packee,
                        style: {
                            color: color_packee
                        }
                    },
                    plotLines : [{
                        value : seuil_packee,
                        color : color_packee,
                        dashStyle : 'shortdash',
                        width : 2,
                        label : {
                            text : ''
                        }
                    }],
                    labels: {
                        format: '{value} €',
                        style: {
                            color: color_packee
                        }
                    },
                    gridLineColor: 'transparent',
                    opposite: true //Pour que le deuxième axe soit à l'opposé du premier
                }],
                plotOptions: {
                    line: {
                        cursor: 'pointer',
                        marker: {
                            symbol: 'triangle'
                        },
                        dataLabels: {
                            enabled: false
                        }
                    }
                },
                tooltip: {
                    formatter: function() {
                        return '<b>'+ this.y +'</b> €<br/>';
                    }
                },              
                series: main_data,
                drilldown: {
                    series: drilldown_series,
                    drillUpButton: {
                        relativeTo: 'spacingBox',
                        position: {
                            y: 0,
                            x: 0
                        }
                    }
                },
                exporting: {
                    enabled: true
                }
            });

我知道Highcharts中没有任何原生函数可以“始终显示”绘图线。有没有人有建议,所以我可以在2015年的演练中显示我的两个情节线?

1 个答案:

答案 0 :(得分:1)

如果要在自动缩放不显示的点上显示情节线,则必须中断自动缩放。用绘图线无法解决这个问题。

使用自动轴缩放功能可以使用线序列而不是绘图线 如果您希望它的行为类似于绘图线而不是系列,则可以禁用图例条目,工具提示等。

这样,轴将始终自动缩放以包含您的线。

example