Subversion Repositories SmartDukaan

<?php 
        $brands = array();
        $map = array();
        $dates = array();
        foreach ($brand_preferences as $key => $value) {
                $brands[$value['brand_preferences']['brand']] = $value['brand_preferences']['brand'];
                $dates[$value[0]['date']] = $value[0]['date'];
                $map[$value[0]['date']][$value['brand_preferences']['brand']] = $value[0]['count'];
        }
?>

<script type="text/javascript" src="https://www.google.com/jsapi"></script>

<script type="text/javascript">
google.load('visualization', '1', {packages: ['corechart', 'line']});
google.setOnLoadCallback(drawAxisTickColors);

function drawAxisTickColors() {
      var data = new google.visualization.DataTable();
      data.addColumn('date', 'Date');
      <?php foreach ($brands as $key => $value):?>
        data.addColumn('number', '<?php echo $value;?>');
      <?php endforeach;?>

      data.addRows([
      <?php foreach ($dates as $key => $date):?>
        [new Date('<?php echo $date;?>'),
        <?php foreach ($brands as $key => $brand) :?>
                <?php if(isset($map[$date][$brand])):?>
                        <?php echo $map[$date][$brand];?>,
                        <?php else:?>
                                0,
                        <?php endif;?>
        <?php endforeach;?>
        ],
      <?php endforeach;?>      
      ]);

      var options = {
        hAxis: {
          title: 'Date',
          textStyle: {
            color: '#01579b',
            fontSize: 20,
            fontName: 'Arial',
            bold: true,
            italic: true
          },
          titleTextStyle: {
            color: '#01579b',
            fontSize: 16,
            fontName: 'Arial',
            bold: false,
            italic: true
          }
        },
        vAxis: {
          title: 'Count',
          textStyle: {
            color: '#1a237e',
            fontSize: 24,
            bold: true
          },
          titleTextStyle: {
            color: '#1a237e',
            fontSize: 24,
            bold: true
          }
        },
        colors: ['#a52714', '#097138']
      };
      var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
      chart.draw(data, options);
    }
</script>

<div class="table-responsive">
        <table id="example" class="display table table-striped" cellspacing="0" width="100%">
            <thead>
                <tr>
                    <th>Date</th>
                    <?php foreach ($brands as $key => $brand):?>
                    <th><?php echo ucfirst($brand);?></th>      
                    <?php endforeach;?>
                </tr>
            </thead>
            <tfoot>
                <tr>
                    <th>Date</th>
                    <?php foreach ($brands as $key => $brand):?>
                    <th><?php echo ucfirst($brand);?></th>      
                    <?php endforeach;?>
                </tr>
            </tfoot>
            <tbody>
                <?php foreach ($dates as $key => $date):?>
                <tr>
                        <td><?php echo $date;?></td>
                        <?php foreach ($brands as $key => $brand) :?>
                                <td>
                                <?php if(isset($map[$date][$brand])):?>
                                        <?php echo $map[$date][$brand];?>
                                        <?php else:?>
                                                0
                                        <?php endif;?>
                                        </td>
                        <?php endforeach;?>
                </tr>
              <?php endforeach;?>      
                </tbody>
        </table>            
</div>

<div id="chart_div" style="width: 1200px; height: 900px"><div>

<script type="text/javascript" src="//cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.7/css/jquery.dataTables.css"></link>
<script type="text/javascript">
$(document).ready(function() {
    $('#example').DataTable();
} );
</script>