如何在 laravel 中为 highcharts 做 if else 语句

Question

Blade 文件中的 HTML 和 JS。

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

<script type="text/javascript">
  
$(document).ready(function () {

    // Build the chart
    Highcharts.chart('container', {
        chart: {
            plotBackgroundColor: null,
            plotBorderWidth: null,
            plotShadow: false,
            type: 'pie'
        },
        title: {
            text: 'Pie Chart'
        },
        tooltip: {
            pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
        },
        plotOptions: {
            pie: {
                allowPointSelect: true,
                cursor: 'pointer',
                dataLabels: {
                    enabled: false
                },
                showInLegend: true
            }
        },
        credits: {
          enabled: false
        },
        exporting: {
          enabled: false
        },
        series: [{
            name: 'Percentage',
            colorByPoint: true,
            data: [{
                name: 'Questions Asked',
                y: {!! $question_asked_sum !!},
                sliced: true,
                selected: true
            }, {
                name: 'Low Confidence',
                y: {!! $low_confidence_sum !!}
            }, {
                name: 'No Answer',
                y: {!! $no_answer_sum !!}
            }, {
                name: 'Missing Intent',
                y: {!! $missing_intent_sum !!}
            }]
        }]
    });
});


</script>

<div class="panel-body">

  <form id="form-project" role="form" action="{{action('AltHr\Chatbot\TrackerController@graph')}}" autocomplete="off" method="POST">
    {{csrf_field()}}

    <div class="form-group-attached">
      <div class="row">
        <div class="col-lg-6">
          <div class="form-group form-group-default required" >
              <label>From</label>
              <input type="date" class="form-control" name="from" required>
          </div>
        </div>

        <div class="col-lg-6">
          <div class="form-group form-group-default required" >
              <label>To</label>
              <input type="date" class="form-control" name="to" required>
          </div>
        </div>
      </div>
    </div>
    <br/>
    <button class="btn alt-btn-black btn-xs alt-btn pull-right" type="submit">Select</button>
  </form>

  <br/><br/>
    <div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>

</div>

控制器中的功能。

public function graph(Request $request) 
{
    //$statistics = DiraStatistics::where('date_access',$request->date)->get();
    $statistics = DiraStatistics::whereBetween('date_access',array($request->from, $request->to))->get();

    $question_asked_sum = $statistics->sum('question_asked');
    $low_confidence_sum = $statistics->sum('low_confidence');
    $no_answer_sum = $statistics->sum('no_answer');
    $missing_intent_sum = $statistics->sum('missing_intent');

    return view('AltHr.Chatbot.graph', compact('question_asked_sum', 'low_confidence_sum', 'no_answer_sum', 'missing_intent_sum'));
}

大家好，目前我已经完成了一个基本功能，可以根据从数据库中选择的日期查看图表。图表工作正常，但如果没有图表，它将看起来像这样

所以我的意思是它是正确的，但它看起来有点难看，所以我怎么能写一个 if else 语句，以便如果所选日期之间没有数据，那么它不会显示为图表，而是“没有数据，请选择日期优先”，但如果有数据，如果选择日期，则显示图表？

Answer 1

您可以使用刀片 @if 声明

{{-- if all values are empty, show message without the chart --}}
@if ( empty($question_asked_sum) && empty($low_confidence_sum) && empty($no_answer_sum) && empty($missing_intent_sum)  )
  no data, please select a date first
@else
  <div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>
  <script type="text/javascript">
    {{-- your highchart logic here  --}}
  </script>
@endif