Можно ли показать диаграмму, если значение скобки массива пустое или пустое в старшей диаграмме

Question

У меня проблема с моим HighChart, потому что, когда мой ответ json равен нулю или пуст, диаграмма не отображается, если ответ имеет значение, отображаемое на панели. поэтому вопрос возможно ли на старшей диаграмме, если значение ответа json равно нулю?

Моя диаграмма столбцов показывает вывод, как это:

Ответ:

Моя функция HighChart:

    categories = [],
seriesNames = ['MR', 'MR_HIT', 'MR_HIT_PERCENTAGE'],
series = [];

$.getJSON('ajax/ams_sla_report_chart.php', function(data,name){

    data.forEach(function(arr) {
        arr.forEach(function(el, i) {

            if (i === 0) {
                categories.push(el);
            } else if (series[i - 1]) {
                series[i - 1].data.push(el);
            } else {                    
                series.push({
                     name: seriesNames[i - 1],
                    data: [el]
                });
            }
        });
    });

    var chart = new Highcharts.Chart({
        chart: {
            renderTo: 'containers',
            type: 'column',
            inverted: false    
        },
        legend: {
            layout: 'horizontal',
            align: 'right',
            verticalAlign: 'middle'
        },
        xAxis: {
            categories: categories
        },
        plotOptions: {
            column: {
                minPointLength: 3
            }
        },
        title: {
           text: 'Priority Based on SLA'
        },
        series:series       
    });

    // chart.series[0].name="SOLVED MR";
    // chart.series[1].name="TOTAL MR HIT";
    // chart.series[2].name="TOTAL MR HIT PERCENTAGE";


    function showValues() {
        $('#alpha-value').html(chart.options.chart.options3d.alpha);
        $('#beta-value').html(chart.options.chart.options3d.beta);
        $('#depth-value').html(chart.options.chart.options3d.depth);
    }

    // Activate the sliders
    $('#sliders_eng input').on('input change', function () {
        chart.options.chart.options3d[this.id] = parseFloat(this.value);
        showValues();
        chart.redraw(false);
    });

    showValues();


});

Answer 1

Модуль no-data-to-display может отображать сообщение на графике при отсутствии данных:

lang: {
    noData: "no-data-to-display"
},
noData: {
    ...
}

Демонстрационная версия: https://jsfiddle.net/BlackLabel/8acxywjv/

Справочник по API: https://api.highcharts.com/highcharts/noData

Answer 2

Невозможно нарисовать диаграмму, если серия пуста.Вы можете добавить условие if и нарисовать диаграмму, только если series имеет данные.В противном случае показать другое сообщение

$.getJSON('ajax/ams_sla_report_chart.php', function(data, name) {

  data.forEach(function(arr) {
    arr.forEach(function(el, i) {

      if (i === 0) {
        categories.push(el);
      } else if (series[i - 1]) {
        series[i - 1].data.push(el);
      } else {
        series.push({
          name: seriesNames[i - 1],
          data: [el]
        });
      }
    });
  });
  if (series.length !== 0) { // show chart only if series has data
    var chart = new Highcharts.Chart({
      chart: {
        renderTo: 'containers',
        type: 'column',
        inverted: false
      },
      legend: {
        layout: 'horizontal',
        align: 'right',
        verticalAlign: 'middle'
      },
      xAxis: {
        categories: categories
      },
      plotOptions: {
        column: {
          minPointLength: 3
        }
      },
      title: {
        text: 'Priority Based on SLA'
      },
      series: series
    });

    // chart.series[0].name="SOLVED MR";
    // chart.series[1].name="TOTAL MR HIT";
    // chart.series[2].name="TOTAL MR HIT PERCENTAGE";


    function showValues() {
      $('#alpha-value').html(chart.options.chart.options3d.alpha);
      $('#beta-value').html(chart.options.chart.options3d.beta);
      $('#depth-value').html(chart.options.chart.options3d.depth);
    }

    // Activate the sliders
    $('#sliders_eng input').on('input change', function() {
      chart.options.chart.options3d[this.id] = parseFloat(this.value);
      showValues();
      chart.redraw(false);
    });

    showValues();
  } // end of if
  else {
    // add a code to ask user to slet user know that chart cannot be drawn

  }
});