# Graphics side by side

**URL:** <https://forum.genieacs.com/t/graphics-side-by-side/643>\
**Category:** Uncategorized\
**Created:** [March 10, 2020, 4:29pm UTC](https://forum.genieacs.com/t/graphics-side-by-side/643 "2020-03-10T16:29:24Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![rogerioalves](https://yyz1.discourse-cdn.com/flex035/user_avatar/forum.genieacs.com/rogerioalves/32/613_2.png) [@rogerioalves](https://forum.genieacs.com/u/rogerioalves)\
**Post date:** [March 10, 2020, 4:29pm UTC](https://forum.genieacs.com/t/graphics-side-by-side/643/1 "2020-03-10T16:29:24Z")

</div>

hello, does anyone know how to put the graphics side by side? Like the photo. Mine are under each other. ![Sem título](https://canada1.discourse-cdn.com/flex035/uploads/genieacs/original/1X/5b283b55ab7b667d04ae212507a976397b5fc846.png)

 ![Sem título2](https://canada1.discourse-cdn.com/flex035/uploads/genieacs/original/1X/d37ceb7666da43e40800e0f54548af7affb6a80d.png)

---

<div class="post-metadata">

**Author:** ![akcoder](https://yyz1.discourse-cdn.com/flex035/user_avatar/forum.genieacs.com/akcoder/32/11_2.png) [@akcoder](https://forum.genieacs.com/u/akcoder)\
**Post date:** [March 10, 2020, 4:51pm UTC](https://forum.genieacs.com/t/graphics-side-by-side/643/2 "2020-03-10T16:51:33Z")

</div>

You don’t mention what version of GenieACS you are using, but I’m going to presume that v1.2 works the same as v1.1.

If you have any trouble, post your json.graph.erb file.

```json
{
  "row1" : {
    "CINR" : [
      {
        "label" : "Good",
        "color" : "#66ca0f",
        "query" : {"_lastInform" : {"$gt" : "<%= threshold_green %>"}}
      },
      {
        "label" : "Acceptable",
        "color" : "#fcfe04",
        "query" : {"_lastInform" : {"$lt" : "<%= threshold_green %>", "$gt" : "<%= threshold_yellow %>"}}
      },
      {
        "label" : "Poor",
        "color" : "#cc0204",
        "query" : {"_lastInform" : {"$lt" : "<%= threshold_yellow %>"}}
      }
    ]
  },
  "row2" : {
    "RSSI" : [
      {
        "label" : "Good",
        "color" : "#66ca0f",
        "query" : {"_lastInform" : {"$gt" : "<%= threshold_green %>"}}
      },
      {
        "label" : "Acceptable",
        "color" : "#fcfe04",
        "query" : {"_lastInform" : {"$lt" : "<%= threshold_green %>", "$gt" : "<%= threshold_yellow %>"}}
      },
      {
        "label" : "Poor",
        "color" : "#cc0204",
        "query" : {"_lastInform" : {"$lt" : "<%= threshold_yellow %>"}}
      }
    ]
  },
  "row3" : {
    "Online" : [
      {
        "label" : "Online now",
        "color" : "#66ca0f",
        "query" : {"_lastInform" : {"$gt" : "<%= threshold_green %>"}}
      },
      {
        "label" : "Past 24 hours",
        "color" : "#fcfe04",
        "query" : {"_lastInform" : {"$lt" : "<%= threshold_green %>", "$gt" : "<%= threshold_yellow %>"}}
      },
      {
        "label" : "Others",
        "color" : "#cc0204",
        "query" : {"_lastInform" : {"$lt" : "<%= threshold_yellow %>"}}
      }
    ]
  }
}

```

---

<div class="post-metadata">

**Author:** ![rogerioalves](https://yyz1.discourse-cdn.com/flex035/user_avatar/forum.genieacs.com/rogerioalves/32/613_2.png) [@rogerioalves](https://forum.genieacs.com/u/rogerioalves)\
**Post date:** [March 10, 2020, 5:09pm UTC](https://forum.genieacs.com/t/graphics-side-by-side/643/3 "2020-03-10T17:09:55Z")

</div>

I’m using version 1.2

 ![Sem título3](https://canada1.discourse-cdn.com/flex035/uploads/genieacs/original/1X/569b012047c3527f0cba8164b95ee484163b895f.png)

---

<div class="post-metadata">

**Author:** ![akcoder](https://yyz1.discourse-cdn.com/flex035/user_avatar/forum.genieacs.com/akcoder/32/11_2.png) [@akcoder](https://forum.genieacs.com/u/akcoder)\
**Post date:** [March 10, 2020, 6:30pm UTC](https://forum.genieacs.com/t/graphics-side-by-side/643/4 "2020-03-10T18:30:36Z")

</div>

Try adding another nesting level to the overview graph

---

<div class="post-metadata">

**Author:** ![rogerioalves](https://yyz1.discourse-cdn.com/flex035/user_avatar/forum.genieacs.com/rogerioalves/32/613_2.png) [@rogerioalves](https://forum.genieacs.com/u/rogerioalves)\
**Post date:** [March 10, 2020, 6:38pm UTC](https://forum.genieacs.com/t/graphics-side-by-side/643/5 "2020-03-10T18:38:53Z")

</div>

I edited it wrong and now the ui is blank, there is no way to revert through the ui. Do you know where I edit? Installed in ubunutu 18.

 ![Sem título4](https://canada1.discourse-cdn.com/flex035/uploads/genieacs/original/1X/e1b73a9957201286ac8425c6baf16fe3d2678c23.png)

---

<div class="post-metadata">

**Author:** ![rogerioalves](https://yyz1.discourse-cdn.com/flex035/user_avatar/forum.genieacs.com/rogerioalves/32/613_2.png) [@rogerioalves](https://forum.genieacs.com/u/rogerioalves)\
**Post date:** [March 10, 2020, 6:40pm UTC](https://forum.genieacs.com/t/graphics-side-by-side/643/6 "2020-03-10T18:40:23Z")

</div>

![Sem título6](https://canada1.discourse-cdn.com/flex035/uploads/genieacs/original/1X/2f0c50f20606fcfd0fc627b58e1272e140d6b9de.png)

---

<div class="post-metadata">

**Author:** ![rogerioalves](https://yyz1.discourse-cdn.com/flex035/user_avatar/forum.genieacs.com/rogerioalves/32/613_2.png) [@rogerioalves](https://forum.genieacs.com/u/rogerioalves)\
**Post date:** [March 10, 2020, 7:41pm UTC](https://forum.genieacs.com/t/graphics-side-by-side/643/7 "2020-03-10T19:41:17Z")

</div>

do you know how to reverse the changes made by the ui?

---

<div class="post-metadata">

**Author:** ![akcoder](https://yyz1.discourse-cdn.com/flex035/user_avatar/forum.genieacs.com/akcoder/32/11_2.png) [@akcoder](https://forum.genieacs.com/u/akcoder)\
**Post date:** [March 11, 2020, 5:01pm UTC](https://forum.genieacs.com/t/graphics-side-by-side/643/8 "2020-03-11T17:01:21Z")

</div>

You will need to manually edit the mongo db I suspect. We haven’t migrated to v1.2

---

<div class="post-metadata">

**Author:** ![vytasu](https://avatars.discourse-cdn.com/v4/letter/v/da6949/32.png) [@vytasu](https://forum.genieacs.com/u/vytasu)\
**Post date:** [March 12, 2020, 3:03pm UTC](https://forum.genieacs.com/t/graphics-side-by-side/643/9 "2020-03-12T15:03:24Z")

</div>

Hi all,  
I have edited overview window a bit and ui also started to show white page only. Tried restart server, genieacs-ui with no success. As I remember, I changed one chart, after that I moved that chart from one group to another in overview config. I have made a lot configuration today. Where can I find that information in mongodb? I guess this is the only way?  
Chrome F12 diag shows error:  
overview-page.ts:29 Uncaught TypeError: Cannot convert undefined or null to object

---

<div class="post-metadata">

**Author:** ![vytasu](https://avatars.discourse-cdn.com/v4/letter/v/da6949/32.png) [@vytasu](https://forum.genieacs.com/u/vytasu)\
**Post date:** [March 13, 2020, 8:41am UTC](https://forum.genieacs.com/t/graphics-side-by-side/643/10 "2020-03-13T08:41:01Z")

</div>

ok, I’ve restored my ui, by editing mongodb. I had to delete group I’ve created:  
db.config.remove({ “\_id” : “ui.overview.groups.Update.0”, “value” : “‘Updates’” }  
It cause me ui error. This group had no label line as other groups had in db. I’ve tried to add label line at first, but it didn’t help:  
db.config.insert({ “\_id” : “ui.overview.groups.Update.label”, “value” : “‘Updates’” })

---

<div class="post-metadata">

**Author:** ![KGcasa](https://avatars.discourse-cdn.com/v4/letter/k/f4b2a3/32.png) [@KGcasa](https://forum.genieacs.com/u/KGcasa)\
**Post date:** [April 23, 2020, 5:04pm UTC](https://forum.genieacs.com/t/graphics-side-by-side/643/11 "2020-04-23T17:04:00Z")

</div>

See here: [1.2+ How to arrange charts in Overview?](https://forum.genieacs.com/t/1-2-how-to-arrange-charts-in-overview/727/3)

It shows how to use groups inside the config editor for _Admin | Config | Overview_ to create one or more rows.

This example creates two rows, the first with three charts and the second with just one:  
 ![image](https://canada1.discourse-cdn.com/flex035/uploads/genieacs/original/1X/8e1be1de4cdad7e90ff5f3e5e00ecf76f5f89c86.png)

---

<div class="post-metadata">

**Author:** ![Shrawan](https://yyz1.discourse-cdn.com/flex035/user_avatar/forum.genieacs.com/shrawan/32/1467_2.png) [@Shrawan](https://forum.genieacs.com/u/Shrawan)\
**Post date:** [September 6, 2021, 6:52am UTC](https://forum.genieacs.com/t/graphics-side-by-side/643/12 "2021-09-06T06:52:14Z")

</div>

to solve this problem, please use this command:

1. db.config.find()
2. db.config.find({"\_id":/._ui.overview.groups.rsrq._/})
3. db.config.remove({"\_id":/._ui.overview.groups.sinr._/})

 ![overview_mongod](https://canada1.discourse-cdn.com/flex035/uploads/genieacs/original/1X/094765e9dc0ef9f728791be32c66f981d0b04024.png)

---

<div class="post-metadata">

**Author:** ![mayo1606](https://yyz1.discourse-cdn.com/flex035/user_avatar/forum.genieacs.com/mayo1606/32/2697_2.png) [@mayo1606](https://forum.genieacs.com/u/mayo1606)\
**Post date:** [March 5, 2024, 2:48pm UTC](https://forum.genieacs.com/t/graphics-side-by-side/643/13 "2024-03-05T14:48:15Z")

</div>

Hello! newbie here! Can you tell us how graphs like that are created?
