An Example of a Google Bar Chart

by kunalvashist

HTML

<script
  src="https://code.jquery.com/jquery-1.12.4.min.js"
  integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ="
  crossorigin="anonymous"></script>  <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
  <div id="chart_div"></div>

JavaScript

var bCode = '0133';
        google.charts.load('current', {
            packages: ['corechart', 'bar']
        });
        google.charts.setOnLoadCallback(function () {
            drawBasic(bCode);
        });
        
  function drawBasic(branchData) {

  

    var mainData = [
                      {
                        "branchCode": "0133",
                        "openingTime": "9am",
                        "closingTime": "5pm",
                        "workingDays": [
                          "Monday",
                          "Tuesday",
                          "Wednesday",
                          "Thursday",
                          "Friday"
                        ],
                        "queueDetails": {
                          "Thursday": {
                            "10AM": {
                              "peopleWaiting": "44",
                              "ticketsServed": "12",
                              "time": "2018-07-26 09:20:33"
                            }
                          },
                          "Tuesday": {
                            "11AM": {
                              "peopleWaiting": "5",
                              "ticketsServed": "30",
                              "time": "2018-07-24 10:33:35"
                            },
                            "5PM": {
                              "peopleWaiting": "0",
                              "ticketsServed": "109",
                              "time": "2018-07-24 16:55:35"
                            },
                            "10AM": {
                              "peopleWaiting": "2",
                              "ticketsServed": "20",
                              "time": "2018-07-24 09:48:19"
                            }
                          },
                          "Wednesday": {
                            "10AM": {
                              "peopleWaiting": "44",
                              "ticketsServed": "12",
  ...