Alter highchart output to display start - end date

Posted by php_d on Stack Overflow See other posts from Stack Overflow or by php_d
Published on 2012-03-25T17:25:52Z Indexed on 2012/03/25 17:28 UTC
Read the original article Hit count: 227

Filed under:
|

I currently have the following highchart which display a start date and outputs the values for the next 31 days of data. Does anyone know how I may improve on this to include and end date so that I can filter the data by smaller specific amounts? On the x-axis I am also trying to only display labels that have data attached to them and hide any others. Any help is appreciated.

My code is as follows:

<script type="text/javascript">
        var chart;
        $(document).ready(function() {
            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'container',
                    type: 'line',
                    marginRight: 130,
                    marginBottom: 25
                },
                title: {
                    text: '<?php echo $type ?>',
                    x: -20 //center
                },
                xAxis: {
                    categories: [
                        <?php
                        $start = $_POST["dateStart"];

                        $dates = array();

                        for ($i = 0, $days = date('t', strtotime($start)); $i < $days; ++$i)
                            {
                                 $dates[] = date('Y-m-d', strtotime($start . ' + ' . $i . ' day'));
                            }
                        echo "'" . implode("', '", $dates) . "'";
                        ?>
                        ]
                },
                yAxis: {
                    title: {
                        text: 'Total Amount'
                    },
                    plotLines: [{
                        value: 0,
                        width: 1,
                        color: '#808080'
                    }]
                },
                tooltip: {
                    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
                },
                series: [
                    <?php
                        foreach ($array as $legend => $data)
                            {
                            echo '{';
                            echo "name: '" . $legend . "',";
                            $values = array();
                            for ($i = 0; $i < $days; ++$i)
                            {
                                $date = date('Y-m-d', strtotime($start . ' + ' . $i . ' day'));
                                $values[] = isset($data[$date]) ? $data[$date] : 0;
                            }
                        echo 'data: [' . implode(', ', $values) . '],';

                        echo '},';
                        }
                    ?>
                    ]
            });
        });

Thanks

© Stack Overflow or respective owner

Related posts about php

Related posts about highcharts