Google Graph API change x-axis from left to right to right to left

We have Google Graph on our website, everything is working fine but my client is requesting if we can have the dates from right to left.

I went through the Google API as I didn’t find anything on this, also their seems to be unsolved questions on this topic.

Read More

Example:

Currently its like this
27th  26th  25th  24th  23rd

It should be like this
23rd  24th  25th  26th  27th

I have also attached a screenshot of it.

JS

<script type="text/javascript">
  google.load("visualization", "1", {packages:["corechart"]});
  google.setOnLoadCallback(drawChart);
  function drawChart() {
    var data = google.visualization.arrayToDataTable([
      ['', 'Current Demand'],
      <?php echo $data; ?>
    ]);

    var options = {
            width: 390,
            height: 261,
            isStacked: true,
            legend: 'none',
            colors: ['#fff'],
            backgroundColor: {fill:'transparent' },
            vAxis: {textColor: '#ffffff', title: '', titleTextStyle: {color: 'white'}},
            hAxis: {textColor: '#ffffff', title: '', titleTextStyle: {color: 'white'}}
    }

    var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
    chart.draw(data, options);
  }
</script>

PHP

<?php
        global $post;
        $args = array(
            'order' => 'DESC',
            'orderby' => 'post_date',
            'post_status' => 'publish',
            'post_type' => 'demand',
            'showposts' => 5
        );
        if (have_posts()):
            $list_of_posts = new WP_Query($args); 
                while ($list_of_posts->have_posts()):$list_of_posts->the_post();

                    $the_post = get_post($post->ID);
                    $date = $the_post->post_date;
                    $date = date("dS M", strtotime($date));

                    $current_demand = get_metadata('post', $post->ID, 'current_demand');
                    $current_demand = $current_demand[0];

                    //$maximum_supply = get_metadata('post', $post->ID, 'maximum_supply');
                    //$maximum_supply = $maximum_supply[0];

                    $data .= "['$date', $current_demand],";
                endwhile;
        endif;
        // Remove the extrea comma from the array which was created above.
        $data = rtrim($data, ',');
?>

enter image description here

Related posts

Leave a Reply

1 comment

  1. There are no options in google chart API. But you can achieve this by changing the order of the records fetch from db in php code.
    you may need to change

    'order' => 'DESC', this to 'order' => 'ASC',