时间戳

首页 > 解决方案 > Highcharts图表更新功能导致数据点缺失

highcharts - Highcharts图表更新功能导致数据点缺失

问题描述

我用来自谷歌电子表格的数据和按钮单击时的图表更新功能构建了一个面积图：见小提琴

图表更新功能更改图表中显示的电子表格的列：

    $(document).ready(function(){
  $("#total").click(function(){
              var chart = $('#container').highcharts();  
              chart.update({
                        yAxis: [{
                          min: -6000,
                          max: 6000,
                          tickPositions: [0, 2000, 4000, 6000]
                        },
                        {
                          min: -600,
                          max: 600,
                          tickPositions: [200, 400, 600]
                        }],
                        data: {
                               seriesMapping: [{
                                x: 0,
                                y: 1,
                                case_bis4: 2, 
                                case_5bis14: 3,
                                case_15bis34: 4,
                                case_35bis59: 5,
                                case_60bis79: 6,  
                                case_ab80: 7,
                                death_total: 8,
                                death_bis4: 9,  
                                death_5bis14: 10,  
                                death_15bis34: 11, 
                                death_35bis59: 12,
                                death_60bis79: 13,
                                death_ab80: 14
                              },
                              {
                                x: 0,
                                y: 8,
                                case_total: 1,
                                case_bis4: 2, 
                                case_5bis14: 3,
                                case_15bis34: 4,
                                case_35bis59: 5,
                                case_60bis79: 6,  
                                case_ab80: 7,
                                death_bis4: 9,  
                                death_5bis14: 10,  
                                death_15bis34: 11, 
                                death_35bis59: 12,
                                death_60bis79: 13,
                                death_ab80: 14
                              }]
                        }
                    });               
  });
});

不幸的是，每次单击按钮时，都会丢失一个数据点。什么地方出了错？

标签： highcharts

解决方案

感谢您的分享。这对我来说似乎是一个错误，我在 Highcharts Github 问题频道上报告了它，您可以在其中关注此线程：https ://github.com/highcharts/highcharts/issues/14189

据我了解，您想创建一个自定义图例，我认为它可以通过不同的方式实现（以避免chart.data更新）。我的想法是循环浏览整个系列并隐藏或显示它们。

这是一个简单的演示：https ://jsfiddle.net/BlackLabel/emyq7j94/ - 您可以通过单击ab80和60 bis 79来测试它alle。

每个按钮都会触发类似的功能（您可以将其保存为出色的功能）：

  chart.series.forEach((s, i) => {
    if (i !== 5 && i !== 12) {
      s.hide()

    } else {
      s.show()
      s.update({
        visible: true
      }, false)
    }
  })

推荐阅读