试图在HighChart中获得series: [{data: []， visible: false}函数

Trying to get the series: [{ data: [], visible: false } function in HighChart working

本文关键字：data visible false 函数 HighChart series 更新时间：2023-09-26

我正在制作一个图形，通过json从mysql数据库解析多个系列。我想，图表只显示一个系列从一开始。HighChart有一个选项就是这样做的，下面的例子:

        series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
        visible: false
    },

由于我的系列被定义:series: []，我还没有能够解决如何解决那些系列，我想不可见。我试图通过调整教程来学习我自己的项目。这是我的代码

var options;
$(document).ready(function() {
    options = {
      chart: {
            renderTo: 'container',
            type: 'spline'
        },
        title: {
            text: 'Graf'
        },
        subtitle: {
            text: ''
        },
        xAxis: {
            categories: [],
            labels: {
            step: 6
        }
        },

          title: {
            text: 'Grafisk fremstilling af den valgte dag',
            y: 10,
            margin: 20
        },
        tooltip: {
            enabled: true,
            formatter: function() {
                return '<b>'+ this.series.name +'</b><br/>'+
                    this.x +': '+ this.y;
            }
        },

        legend: {
                layout: 'vertical',
                align: 'right',
                verticalAlign: 'top',
                x: -10,
                y: 100,
                borderWidth: 0
            },
    plotOptions: {
                series: {
            marker: {
                enabled: false
            }
        }
            },
            series: []
        }

   $.getJSON("dataNew.php", function(json) {
            options.xAxis.categories = json[0]['data'];
            options.series[0] = json[1];
            options.series[1] = json[2];
            options.series[2] = json[3];
            options.series[3] = json[4];
            options.series[4] = json[5];
            chart = new Highcharts.Chart(options);
        });
});
  $(function() {
    $( "#datepicker" ).datepicker({
      dateFormat: "yy-mm-dd",
      showOn: "button",
      buttonImage: "calendar.gif",
      buttonImageOnly: true,
      onSelect: function(dateText, inst) { 
        $.getJSON("dataNew.php?dateParam="+dateText, function(json){
            options.xAxis.categories = json[0]['data'];
            options.series[0] = json[1];
            options.series[1] = json[2];
            options.series[2] = json[3];
            options.series[3] = json[4];
            options.series[4] = json[5];
            chart = new Highcharts.Chart(options);
        });
      }
    });
});
</script>

我在图表绘制完成后隐藏了序列。

得到JSON的代码是这样的:

$.getJSON("dataNew.php?dateParam="+dateText, function(json){
        options.xAxis.categories = json[0]['data'];
        options.series[0] = json[1];
        options.series[1] = json[2];
        options.series[2] = json[3];
        options.series[3] = json[4];
        options.series[4] = json[5];
        chart = new Highcharts.Chart(options);
    });

我所做的是在图表绘制后添加以下内容来隐藏一个特定的系列:

chart.series[i].hide();

在您的示例中，如果您想隐藏第二个系列，您的代码将看起来像:

$.getJSON("dataNew.php?dateParam="+dateText, function(json){
        options.xAxis.categories = json[0]['data'];
        options.series[0] = json[1];
        options.series[1] = json[2];
        options.series[2] = json[3];
        options.series[3] = json[4];
        options.series[4] = json[5];
        chart = new Highcharts.Chart(options);
        chart.series[1].hide();
    });

我想应该可以了。