duanche8554 2017-10-15 22:01
浏览 131
已采纳

如何使用highcharts基于日期选择查看图形

<form id="form-project" role="form" action="{{action('AltHr\Chatbot\TrackerController@graph')}}" autocomplete="off" method="POST">
  {{csrf_field()}}
  <div class="form-group form-group-default required" >
      <label>Date</label>
      <input type="date" class="form-control" name="date" required>
  </div>
  <button class="btn alt-btn-black btn-xs alt-btn pull-right" type="submit">Select</button>
</form>

Route::get('graph','Chatbot\TrackerController@graph');

I would like to find out if there is a way that i can show the chart based on selected dates as i have a dates column in my database. If there is, how should i do it? I am using highcharts to generate the pie chart.
Below are the function i did in controller and the javascript to generate the chart in the html tag.

HTML and JS in blader file

<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">
    <div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>
</div>

Function in controller

<?php

public function graph() {
    $statistics = DiraStatistics::all();

    $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'));
}
?>
</div>

展开全部

  • 写回答

1条回答 默认 最新

  • doupingmao1903 2017-10-16 22:53
    关注

    You need to pass date in your request I'm assuming you are passing it with AJAX here. Since I don't know how you are doing as in your views therefore I'm just adding references for AJAX requests here

    NOTE Make sure about Get and Post methods.

    Then you will get your date in $request object which you can use like this:

    <?php
    
    public function graph(Request $request) {
        $statistics = DiraStatistics::where('dateField',$request->date)->all();
    
        $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'));
    }
    ?>
    

    I hope it will work for you!

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
编辑
预览

报告相同问题?

悬赏问题

  • ¥15 IBMP550小型机使用串口登录操作系统
  • ¥15 关于#python#的问题:现已知七自由度机器人的DH参数,利用DH参数求解机器人的逆运动学解目前使用的PSO算法
  • ¥15 发那科机器人与设备通讯配置
  • ¥15 Linux环境下openssl报错
  • ¥15 我在使用VS编译并执行之后,但是exe程序会报“无法定位程序输入点_kmpc_end_masked于动态链接库exe上“,请问这个问题有什么解决办法吗
  • ¥15 el-select光标位置问题
  • ¥15 单片机 TC277 PWM
  • ¥15 在更新角色衣服索引后,Sprite 并未正确显示更新的效果该如何去解决orz(标签-c#)
  • ¥15 VAE代码如何画混淆矩阵
  • ¥15 求遗传算法GAMS代码
手机看
程序员都在用的中文IT技术交流社区

程序员都在用的中文IT技术交流社区

专业的中文 IT 技术社区,与千万技术人共成长

专业的中文 IT 技术社区,与千万技术人共成长

关注【CSDN】视频号,行业资讯、技术分享精彩不断,直播好礼送不停!

关注【CSDN】视频号,行业资讯、技术分享精彩不断,直播好礼送不停!

客服 返回
顶部