---
# System prepended metadata

title: <center><i class="fa fa-edit"></i> Dashboard with Dispenser Database Cont. </center>
tags: [Internship]

---

# <center><i class="fa fa-edit"></i> Dashboard with Dispenser Database Cont. </center>
###### tags: `Internship`
:::info
**Goal:**
- [x] Test the Drop Down Menu Feature
- [x] Table with Hot, Cold, Warm Water

**Resources:**
[Dashboard access mongoDB from NTUST](https://hackmd.io/@eric248550/BkZpSMjc9)
[2021 物聯網平台實習 (ET2702301)](https://hackmd.io/1vqhIDkqQKqF907HpneANw?view)
[Management Portal](https://portal-mp-ensaas.education.wise-paas.com/console)
[Dashboard Home](https://dashboard-ruiguang-ews.education.wise-paas.com/?orgId=1)
[在Dashboard完成視覺化的設置](https://hackmd.io/@RenJhang/HJ_ruIxVF)
:::
## Test the Drop Down Menu Feature
### Query
![](https://i.imgur.com/MGl1drP.png)

```javascript=
db.raw_data.aggregate([
  {"$match": {"Timming_ISO":{ "$gte" : "$from", "$lt": "$to" } }},
  {"$project": {"ts": "$Timming_ISO", "value": "$WaterVolume"}}
]);
```
### Visualization
![](https://i.imgur.com/JXV8LD1.png)

1. Change Dropdown Title
2. Add Item List to add new item to the drop down menu
3. Can redirect to a dashboard using url

:::danger
The dropdown menu feature seems to be adding each individual drop down manually. Need to figure out a way for this to be directly imported from the database (maybe through MongoDB query)
:::


### General Settings
![](https://i.imgur.com/5DifhKl.png)

1. Change name of graph 
2. **Make sure to hit save**

### Final Product

![](https://i.imgur.com/NauVo8d.png)

Redirects after selecting it from dropdown menu: 

![](https://i.imgur.com/V6dBUwc.png)

## Table with Hot, Cold, Warm Water for Xinxing08
### Query
![](https://i.imgur.com/DQHtXbQ.png)

```javascript=
db.raw_data.aggregate([
  {"$match": {"Timming_ISO":{ "$gte" : "$from", "$lt": "$to" } }},
  {"$project": {"ts": "$Timming_ISO", "value": "$WaterTemp"}}
]);
```
### Visualization 
1. Add new rule
1. Apply to columns named Value
1. Change column header name to Water Volume
1. Add a threshold of 35,40
    - This tells us which water temperatures are above, in, or below this range (or the range for warm) by color
1. Change color mode to Cell

![](https://i.imgur.com/uWyLPUU.png)

### General Settings
![](https://i.imgur.com/5KNk7Au.png)

### Final Product
![](https://i.imgur.com/K9wS1pt.png)
