# Dashboard Template

**URL:** <https://discourse.nodered.org/t/dashboard-template/11136>\
**Category:** Dashboard\
**Created:** [15 May 2019 01:01 UTC](https://discourse.nodered.org/t/dashboard-template/11136 "2019-05-15T01:01:22Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Kwonsoyeong](https://avatars.discourse-cdn.com/v4/letter/k/b3f665/32.png) [@Kwonsoyeong](https://discourse.nodered.org/u/Kwonsoyeong)\
**Post date:** [15 May 2019 01:01 UTC](https://discourse.nodered.org/t/dashboard-template/11136/1 "2019-05-15T01:01:23Z")

</div>

I want to make dashboard template node.  
When I gave a data, automatic make template. It is impossible?  
This is my template. The value is continually added every time new data comes in. Then I want to keep adding a small circle next to it.

```auto
<table layout="row" layout-align="start center" id="table" border="0.5" cellpadding="15">
 <tbody>
 <tr>
 <th>ADDR</th>
 </tr>
     <tr ng-repeat="row1 in msg.addr track by $index">
      <td ng-class="numeric" >{{row1}}</td>
      </tr>
  
 </tbody>
 
 <tbody>
 <tr>
 <th>TEST</th>
 </tr>
     <tr ng-repeat="row2 in msg.c_rate track by $index">
      <td ng-class="numeric" >{{row2}}</td>
      </tr>
  
 </tbody>
</table>

```

And I made template because I want to make a circle.

```auto
<style>

.main1_1{
    display: inline-block;
     margin: 0 auto;
}

.ok1_1{
  height: 25px;
  width: 25px;
  background-color: green;
  border-radius: 50%;
  display: inline-block;
}
.middle{
  height: 25px;
  width: 25px;
  background-color: yellow;
  border-radius: 50%;
  display: inline-block;
}
.low{
  height: 25px;
  width: 25px;
  background-color: red;
  border-radius: 50%;
  display: inline-block;
}
.blank{
    border: 20px;
}
</style>

<div class="main1_1" >
    <div ng-if="msg.c_rate==100">
        <span class="ok1_1"></span>
    </div>
    <div ng-if="msg.c_rate<100 && msg.c_rate>50">
    <span class="middle"></span>
    </div>
    <div ng-if="msg.c_rate<50">
    <span class="low"></span>
    </div>
</div>

```

Let me know if this is possible.

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [15 May 2019 08:06 UTC](https://discourse.nodered.org/t/dashboard-template/11136/2 "2019-05-15T08:06:54Z")

</div>

Yes, it is perfectly possible. You will need to do some research on how to use Angular v1 which the Dashboard uses.