# Dashing for Icinga 3.0.0

**URL:** <https://community.icinga.com/t/dashing-for-icinga-3-0-0/2523>\
**Category:** Visualization, Metrics & Reporting\
**Tags:** dashing, icinga2\
**Created:** [October 17, 2019, 2:57pm UTC](https://community.icinga.com/t/dashing-for-icinga-3-0-0/2523 "2019-10-17T14:57:02Z")\
**Posts on this page:** 17\
**Page:** 1

<div class="post-metadata">

**Author:** ![dnsmichi](https://community.icinga.com/user_avatar/community.icinga.com/dnsmichi/32/7721_2.png) [@dnsmichi](https://community.icinga.com/u/dnsmichi)\
**Post date:** [October 17, 2019, 2:57pm UTC](https://community.icinga.com/t/dashing-for-icinga-3-0-0/2523/1 "2019-10-17T14:57:02Z")

</div>

![](https://community.icinga.com/uploads/default/original/2X/e/e112d08aac6104fb055b0451bdfe356ebbd4829f.jpeg)

Milestone [3.0.0](https://github.com/dnsmichi/dashing-icinga2/milestone/4?closed=1)

### Enhancements

- Refine Icinga Dashboard #86
  - Use ChartJS for Doughnut and Bar Charts
  - Host/Service Overview Charts
  - Connected Endpoints Charts
  - Active Checks Charts
  - Downtimes & Acknowledgement Charts
  - Add clock widget with timezone

- Provide Docker container `dnsmichi/dashing-icinga2` #85
- Add option to show only hard state problems #73 (thanks Dambakk)
- Add timezone to clock widget #74 (thanks Dambakk)
- Add title support for the Iframe widget for Icinga Web #90
- Support either Dashing or Smashing as Ruby gem #88

### Fixes

- Version detection broken with Icinga 2.11 #83

---

<div class="post-metadata">

**Author:** ![MoeJoe](https://community.icinga.com/user_avatar/community.icinga.com/moejoe/32/195_2.png) [@MoeJoe](https://community.icinga.com/u/MoeJoe)\
**Post date:** [October 18, 2019, 11:10am UTC](https://community.icinga.com/t/dashing-for-icinga-3-0-0/2523/2 "2019-10-18T11:10:47Z")

</div>

hy @dnsmichi

nice upgrade…

but i’ve got a small visual bug…

My “Problems” Tab and the “Statistics” tab are Empty…

And on the Tab “Endpoinzs”,“Downtimes”,“Acknowledements” the charts are inverse…

Enviroment:

- Icinga 2.11.0-1
- Icingaweb 2.7.2
- Dashing 3.0
- Director 1.7.0
- Php 7.0.33

should i create a git issue ?

 ![icinga_dashing](https://community.icinga.com/uploads/default/original/2X/8/8365b8e333efae33d6eae09aef1607a2fe72de4a.jpeg)

---

<div class="post-metadata">

**Author:** ![dnsmichi](https://community.icinga.com/user_avatar/community.icinga.com/dnsmichi/32/7721_2.png) [@dnsmichi](https://community.icinga.com/u/dnsmichi)\
**Post date:** [October 18, 2019, 12:06pm UTC](https://community.icinga.com/t/dashing-for-icinga-3-0-0/2523/3 "2019-10-18T12:06:55Z")

</div>

A new topic here please. Also add the diff from your modifications there.

---

<div class="post-metadata">

**Author:** ![Axel577](https://community.icinga.com/user_avatar/community.icinga.com/axel577/32/1753_2.png) [@Axel577](https://community.icinga.com/u/Axel577)\
**Post date:** [November 27, 2019, 2:45pm UTC](https://community.icinga.com/t/dashing-for-icinga-3-0-0/2523/4 "2019-11-27T14:45:08Z")

</div>

@MoeJoe  
Hi Christian, how did you get that dark blue theme?

---

<div class="post-metadata">

**Author:** ![MoeJoe](https://community.icinga.com/user_avatar/community.icinga.com/moejoe/32/195_2.png) [@MoeJoe](https://community.icinga.com/u/MoeJoe)\
**Post date:** [November 27, 2019, 5:11pm UTC](https://community.icinga.com/t/dashing-for-icinga-3-0-0/2523/5 "2019-11-27T17:11:52Z")

</div>

Ive changed the darkness from the dashing background Image in [paint.Net](http://paint.Net)… Thats all

---

<div class="post-metadata">

**Author:** ![melihoztok](https://community.icinga.com/letter_avatar_proxy/v4/letter/m/71c47a/32.png) [@melihoztok](https://community.icinga.com/u/melihoztok)\
**Post date:** [October 4, 2021, 1:17pm UTC](https://community.icinga.com/t/dashing-for-icinga-3-0-0/2523/6 "2021-10-04T13:17:39Z")

</div>

Hi Michael,

i am using dashing for icinga. i upload all your files for detailed dashing and restart dashing but nothing happens. i still have factory default view. What can i do?

---

<div class="post-metadata">

**Author:** ![dbodky](https://community.icinga.com/user_avatar/community.icinga.com/dbodky/32/4988_2.png) [@dbodky](https://community.icinga.com/u/dbodky)\
**Post date:** [October 4, 2021, 1:36pm UTC](https://community.icinga.com/t/dashing-for-icinga-3-0-0/2523/7 "2021-10-04T13:36:41Z")

</div>

Hi Melih,

in the meantime, Michael passed the project on to me. May I know which version of dashing-icinga2 you are currently running (`git describe --long`)? We changed the “default layout” to a more basic view with less different and intricate widgets after release 3.0.0, so maybe this is what you are seeing.

In any case, I’d need you to paste your `dashboards/icinga2.erb` file so I can see what _should_ get rendered by Dashing.

---

<div class="post-metadata">

**Author:** ![melihoztok](https://community.icinga.com/letter_avatar_proxy/v4/letter/m/71c47a/32.png) [@melihoztok](https://community.icinga.com/u/melihoztok)\
**Post date:** [October 5, 2021, 5:20am UTC](https://community.icinga.com/t/dashing-for-icinga-3-0-0/2523/8 "2021-10-05T05:20:51Z")

</div>

Hi Daniel,

i am running Dashing v3.0.0-32-g5ed16c9. i download complete of files and folders from your git repo.

This is my icinga2.erb and my dashing screen

 ![dash](https://community.icinga.com/uploads/default/original/2X/a/a30f9d0c5df716ed4c93b1c90bb961100428418b.jpeg)

```auto
<script type='text/javascript'>
$(function() {
  // These settings override the defaults set in application.coffee. You can do this on a per dashboard basis.
  Dashing.widget_margins = [5,5]
  Dashing.widget_base_dimensions = [300,300]
  //Experimental: widget size based on window size.
  //Dashing.widget_base_dimensions = [$( window ).width()/5, $( window ).height()/2.2];
  Dashing.numColumns = 4
});
</script>

<% content_for :title do %>Icinga 2<% end %>
<div class="gridster">
  <ul>
    <!-- Statistics -->
    <li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
      <div data-view="Clock" data-title="Europe/Istanbul" data-timezone="Europe/Istanbul"></div>
    </li>

    <li data-row="1" data-col="2" data-sizex="1" data-sizey="1">
      <div data-id="icinga-stats" data-view="List" data-unordered="true" data-title="Statistics"></div>
    </li>

    <!-- <li data-row="1" data-col="3" data-sizex="1" data-sizey="1">
      <div
        data-id="bar-chart-acks"
        data-view="Chartjs"
        data-type="horizontalBar"
        data-header="Acknowledgements"
        data-title="Acknowledgements"
        data-labels="Hosts,Services"
        data-colornames="blue,green"
        data-datasets="42,404"
        data-height="300"
        data-width="300"
      ></div>
    </li> -->

    <!-- <li data-row="2" data-col="1" data-sizex="1" data-sizey="1">
      <div
        data-id="doughnut-pie-hosts"
        data-view="Chartjs"
        data-type="doughnut"
        data-title="Hosts"
        data-labels="Up,Down"
        data-colornames="green,red"
        data-datasets="20,13"
        data-height="300"
        data-width="300"
      ></div>
    </li>
    <li data-row="2" data-col="2" data-sizex="1" data-sizey="1">
      <div
        data-id="doughnut-pie-services"
        data-view="Chartjs"
        data-type="doughnut"
        data-title="Services"
        data-labels="OK,Warning,Critical,Unknown"
        data-colornames="green,yellow,red,purple"
        data-datasets="20,13,12,0"
        data-height="300"
        data-width="300"
      ></div>
    </li> -->

    <!-- Service and Hosts wie im alten Dashboard -->
    <li data-row="2" data-col="1" data-sizex="1" data-sizey="1">
      <div
           data-id="icinga-host-meter"
           data-view="Meter"
           data-title="Host Problems"
           data-min="0"
           data-max="100"
      ></div>
    </li>
    <li data-row="2" data-col="2" data-sizex="1" data-sizey="1">
      <div 
           data-id="icinga-service-meter"
           data-view="Meter"
           data-title="Service Problems"
           data-min="0" data-max="100"
      ></div>
    </li>

    <!-- <li data-row="2" data-col="3" data-sizex="1" data-sizey="1">
      <div
        data-id="bar-chart-downtimes"
        data-view="Chartjs"
        data-type="horizontalBar"
        data-header="Downtimes"
        data-title="Downtimes"
        data-labels="Hosts,Services"
        data-colornames="blue,green"
        data-datasets="42,404"
        data-height="300"
        data-width="300"
      ></div>
    </li> -->

    <!-- <li data-row="2" data-col="3" data-sizex="1" data-sizey="1">
      <div
        data-id="bar-chart-endpoints"
        data-view="Chartjs"
        data-type="bar"
        data-header="Endpoints"
        data-title="Endpoints"
        data-labels="Connected,Not Connected"
        data-colornames="green,red"
        data-datasets="42,404"
        data-height="300"
        data-width="300"
      ></div>
    </li> -->

    

    <!-- <li data-row="2" data-col="1" data-sizex="1" data-sizey="1">
      <div
        data-id="bar-chart-checks"
        data-view="Chartjs"
        data-type="horizontalBar"
        data-header="Active Checks"
        data-title="Active Checks"
        data-labels="Hosts/min,Services/min"
        data-colornames="aqua,lime"
        data-datasets="42,404"
        data-height="300"
        data-width="300"
      ></div>
    </li> -->

    <!-- Problems -->
    <!--
    <li data-row="1" data-col="3" data-sizex="1" data-sizey="1">
      <div data-id="icinga-host-meter" data-view="Meter" data-title="Host Problems" data-min="0" data-max="100"></div>
    </li>
    <li data-row="1" data-col="4" data-sizex="1" data-sizey="1">
      <div data-id="icinga-service-meter" data-view="Meter" data-title="Service Problems" data-min="0" data-max="100"></div>
    </li>
    -->

    <!-- Handled -->
    <!--
    <li data-row="2" data-col="1" data-sizex="1" data-sizey="1">
      <div data-id="handled-stats" data-view="List" data-unordered="true" data-title="Handled"></div>
    </li>
    -->
    <!-- Unhandled Host and Service Problems -->
    <!--
    <li data-row="2" data-col="2" data-sizex="1" data-sizey="1">
      <div data-id="icinga-host-problems" data-view="Simplelist" data-title="Unhandled Hosts"></div>
    </li>
    <li data-row="2" data-col="3" data-sizex="1" data-sizey="1">
      <div data-id="icinga-service-problems" data-view="Simplelist" data-title="Unhandled Services"></div>
    </li>
    -->

    <!-- Takes two rows for all service problems by severity -->
    <li data-row="1" data-col="3" data-sizex="2" data-sizey="2">
      <div data-id="icinga-severity" data-view="List" data-unordered="true" data-title="Service and Host Problems"></div>
    </li>

    <!-- Icinga Web 2 iFrame. getIcingaWeb2Url() is defined in config.ru and reads from config/icinga2*.json -->
    <!-- <li data-row="3" data-col="1" data-sizex="2" data-sizey="2">
      <div data-id="iframe" data-view="Iframe" data-title="Icinga Web Host Problems" data-url="<%=getIcingaWeb2Url()%>/monitoring/list/hosts?host_problem=1&sort=host_severity&showFullscreen&showCompact"></div>
    </li>
    <li data-row="3" data-col="3" data-sizex="2" data-sizey="2">
      <div data-id="iframe" data-view="Iframe" data-title="Icinga Web Service Problems" data-url="<%=getIcingaWeb2Url()%>/monitoring/list/services?service_problem=1&sort=service_severity&dir=desc&showFullscreen&showCompact"></div>
    </li>-->
  </ul>

</div>

```

---

<div class="post-metadata">

**Author:** ![dbodky](https://community.icinga.com/user_avatar/community.icinga.com/dbodky/32/4988_2.png) [@dbodky](https://community.icinga.com/u/dbodky)\
**Post date:** [October 5, 2021, 8:10am UTC](https://community.icinga.com/t/dashing-for-icinga-3-0-0/2523/9 "2021-10-05T08:10:30Z")

</div>

Hi Melih,

good news: You are running the most recent version and got all the stuff you need right there in your `dashboards/icinga2.erb` file. Just uncomment the widget definitions for the flashier ChartJS widgets by deleting the `<!-- [...] -->` markers around the respective `<li> [...] </li>` blocks.

Best,  
Daniel

---

<div class="post-metadata">

**Author:** ![melihoztok](https://community.icinga.com/letter_avatar_proxy/v4/letter/m/71c47a/32.png) [@melihoztok](https://community.icinga.com/u/melihoztok)\
**Post date:** [October 7, 2021, 8:36am UTC](https://community.icinga.com/t/dashing-for-icinga-3-0-0/2523/10 "2021-10-07T08:36:47Z")

</div>

Hi Daniel,

Thank you for your support. The template worked as well as it could when I deleted the marks. But I still have minor problems. First, the charts show no data about “Hosts”. The second problem is iframe authentication. Our icinga website is loaded in ifram but stuck login screen. This my new icinga.erb and i add the new screenshots. Thanks a lot.

 ![1](https://community.icinga.com/uploads/default/original/2X/8/8279d7d64077d77dcb4c451e09c41b9a6d4eca16.png)

 ![2](https://community.icinga.com/uploads/default/original/2X/a/a90cb334499f28df63713065f9169cc353398c21.png)

```auto
<script type='text/javascript'>
$(function() {
  // These settings override the defaults set in application.coffee. You can do this on a per dashboard basis.
  Dashing.widget_margins = [5,5]
  Dashing.widget_base_dimensions = [300,300]
  //Experimental: widget size based on window size.
  //Dashing.widget_base_dimensions = [$( window ).width()/5, $( window ).height()/2.2];
  Dashing.numColumns = 4
});
</script>

<% content_for :title do %>Icinga 2<% end %>
<div class="gridster">
  <ul>

  <!--Statistics -->
    <li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
      <div data-view="Clock" data-title="Europe/Istanbul" data-timezone="Europe/Istanbul"></div>
    </li>

    <li data-row="1" data-col="2" data-sizex="1" data-sizey="1">
      <div data-id="icinga-stats" data-view="List" data-unordered="true" data-title="Statistics"></div>
    </li>

    <li data-row="1" data-col="3" data-sizex="1" data-sizey="1">
      <div
        data-id="bar-chart-acks"
        data-view="Chartjs"
        data-type="horizontalBar"
        data-header="Acknowledgements"
        data-title="Acknowledgements"
        data-labels="Hosts,Services"
        data-colornames="blue,green"
        data-datasets="42,404"
        data-height="300"
        data-width="300"
      ></div>
    

    <li data-row="2" data-col="1" data-sizex="1" data-sizey="1">
      <div
        data-id="doughnut-pie-hosts"
        data-view="Chartjs"
        data-type="doughnut"
        data-title="Hosts"
        data-labels="Up,Down"
        data-colornames="green,red"
        data-datasets="20,13"
        data-height="300"
        data-width="300"
      ></div>
    </li>

    <li data-row="2" data-col="2" data-sizex="1" data-sizey="1">
      <div
        data-id="doughnut-pie-services"
        data-view="Chartjs"
        data-type="doughnut"
        data-title="Services"
        data-labels="OK,Warning,Critical,Unknown"
        data-colornames="green,yellow,red,purple"
        data-datasets="20,13,12,0"
        #data-height="200"
        #data-width="200"
      ></div>
    </li>

      <!--Service and Hosts wie im alten Dashboard -->
    <li data-row="2" data-col="1" data-sizex="1" data-sizey="1">
      <div
           data-id="icinga-host-meter"
           data-view="Meter"
           data-title="Host Problems"
           data-labels="OK,Warning,Critical,Unknown"
           data-colornames="green,yellow,red,purple"
           data-datasets="20,13,12,0"
           data-min="0"
           data-max="100"
      ></div>
    </li>
    
    <li data-row="2" data-col="2" data-sizex="1" data-sizey="1">
      <div 
           data-id="icinga-service-meter"
           data-view="Meter"
           data-title="Service Problems"
           data-min="0" 
           data-max="100"
           data-labels="Min,Max"
           data-colornames="green,red"
      ></div>
    </li>

    <li data-row="2" data-col="3" data-sizex="1" data-sizey="1">
      <div
        data-id="bar-chart-downtimes"
        data-view="Chartjs"
        data-type="horizontalBar"
        data-header="Downtimes"
        data-title="Downtimes"
        data-labels="Hosts,Services"
        data-colornames="blue,green"
        data-datasets="42,404"
        data-height="300"
        data-width="300"
      ></div>
    </li>

    <li data-row="2" data-col="3" data-sizex="1" data-sizey="1">
      <div
        data-id="bar-chart-endpoints"
        data-view="Chartjs"
        data-type="bar"
        data-header="Endpoints"
        data-title="Endpoints"
        data-labels="Connected,Not Connected"
        data-colornames="green,red"
        data-datasets="42,404"
        data-height="300"
        data-width="300"
      ></div>
    </li>

    <li data-row="2" data-col="1" data-sizex="1" data-sizey="1">
      <div
        data-id="bar-chart-checks"
        data-view="Chartjs"
        data-type="horizontalBar"
        data-header="Active Checks"
        data-title="Active Checks"
        data-labels="Hosts/min,Services/min"
        data-colornames="aqua,lime"
        data-datasets="42,404"
        data-height="300"
        data-width="300"
      ></div>
    </li>

    <!-- Problems -->
        <li data-row="1" data-col="3" data-sizex="1" data-sizey="1">
      <div data-id="icinga-host-meter" data-view="Meter" data-title="Host Problems" data-min="0" data-max="100"></div>
    </li>

    <li data-row="1" data-col="4" data-sizex="1" data-sizey="1">
      <div data-id="icinga-service-meter" data-view="Meter" data-title="Service Problems" data-min="0" data-max="100"></div>
    </li>
    
    <!-- Handled
        <li data-row="2" data-col="1" data-sizex="1" data-sizey="1">
      <div data-id="handled-stats" data-view="List" data-unordered="true" data-title="Handled"></div>
    </li>
    
         Unhandled Host and Service Problems
        <li data-row="2" data-col="2" data-sizex="1" data-sizey="1">
      <div data-id="icinga-host-problems" data-view="Simplelist" data-title="Unhandled Hosts"></div>
    </li>

    <li data-row="2" data-col="3" data-sizex="1" data-sizey="1">
      <div data-id="icinga-service-problems" data-view="Simplelist" data-title="Unhandled Services"></div>
    </li>
    -->

    <!-- Takes two rows for all service problems by severity -->
    <li data-row="1" data-col="3" data-sizex="2" data-sizey="2">
      <div data-id="icinga-severity" data-view="List" data-unordered="true" data-title="Service and Host Problems"></div>
    </li>

    <!-- Icinga Web 2 iFrame. getIcingaWeb2Url() is defined in config.ru and reads from config/icinga2*.json -->
    <li data-row="3" data-col="1" data-sizex="2" data-sizey="2">
      <div data-id="iframe" data-view="Iframe" data-title="Icinga Web Host Problems" data-url="<admin:dq27Zh@%=getIcingaWeb2Url()%>/monitoring/list/hosts?host_problem=1&sort=host_severity&showFullscreen&showCompact"></div>
    </li>
    <li data-row="3" data-col="3" data-sizex="2" data-sizey="2">
      <div data-id="iframe" data-view="Iframe" data-title="Icinga Web Service Problems" data-url="<%=getIcingaWeb2Url()%>/monitoring/list/services?service_problem=1&sort=service_severity&dir=desc&showFullscreen&showCompact"></div>
    </li>
  </ul>

</div>

```

---

<div class="post-metadata">

**Author:** ![dbodky](https://community.icinga.com/user_avatar/community.icinga.com/dbodky/32/4988_2.png) [@dbodky](https://community.icinga.com/u/dbodky)\
**Post date:** [October 7, 2021, 10:11am UTC](https://community.icinga.com/t/dashing-for-icinga-3-0-0/2523/11 "2021-10-07T10:11:30Z")

</div>

Hi Melih,

thanks for the update. Regarding Icingaweb2: Just log into Icingaweb2 once and keep the browser session open. Dashing-Icinga2 was developed with permanent dashboards in mind, displayed e.g. on a TV mounted to a wall without much user interaction. If you end your browser session, you will have to log into Icingaweb2 again the next time you start your browser.

For your host problem, I have no obvious solution, my setup (same as yours on dashing-icinga2’s side with all widgets enabled) shows the correct information.

Could you share the output of

`$ curl -ksSi -u <api_user:api_password> https://<apihost:apiport>/v1/status/CIB`

with us, please? The data for the `Hosts` widget is taken directly from this API response and this might provide some insight.

---

<div class="post-metadata">

**Author:** ![melihoztok](https://community.icinga.com/letter_avatar_proxy/v4/letter/m/71c47a/32.png) [@melihoztok](https://community.icinga.com/u/melihoztok)\
**Post date:** [October 7, 2021, 10:41am UTC](https://community.icinga.com/t/dashing-for-icinga-3-0-0/2523/12 "2021-10-07T10:41:20Z")

</div>

Daniel,

OK i unterstand the iframe issue. Here is my output;

```auto
HTTP/1.1 200 OK
Server: Icinga/2.11.4-1
Content-Type: application/json
Content-Length: 1438

{"results":[{"name":"CIB","perfdata":[],"status":{"active_host_checks":0.9166666666666666,"active_host_checks_15min":833.0,"active_host_checks_1min":55.0,"active_host_checks_5min":281.0,"active_service_checks":5.233333333333333,"active_service_checks_15min":4933.0,"active_service_checks_1min":314.0,"active_service_checks_5min":1634.0,"avg_execution_time":0.5307904125278832,"avg_latency":0.17841160253727392,"current_concurrent_checks":8.0,"current_pending_callbacks":0.0,"max_execution_time":12.817291975021362,"max_latency":1.1027369499206543,"min_execution_time":0.0,"min_latency":0.0,"num_hosts_acknowledged":0.0,"num_hosts_down":0.0,"num_hosts_flapping":0.0,"num_hosts_handled":0.0,"num_hosts_in_downtime":1.0,"num_hosts_pending":0.0,"num_hosts_problem":0.0,"num_hosts_unreachable":0.0,"num_hosts_up":126.0,"num_services_acknowledged":0.0,"num_services_critical":14.0,"num_services_flapping":0.0,"num_services_handled":9.0,"num_services_in_downtime":65.0,"num_services_ok":799.0,"num_services_pending":0.0,"num_services_problem":20.0,"num_services_unknown":4.0,"num_services_unreachable":0.0,"num_services_warning":2.0,"passive_host_checks":0.0,"passive_host_checks_15min":0.0,"passive_host_checks_1min":0.0,"passive_host_checks_5min":0.0,"passive_service_checks":0.4,"passive_service_checks_15min":363.0,"passive_service_checks_1min":24.0,"passive_service_checks_5min":120.0,"remote_check_queue":0.0,"uptime":47826.36212897301}}]}

```

---

<div class="post-metadata">

**Author:** ![dbodky](https://community.icinga.com/user_avatar/community.icinga.com/dbodky/32/4988_2.png) [@dbodky](https://community.icinga.com/u/dbodky)\
**Post date:** [October 7, 2021, 10:53am UTC](https://community.icinga.com/t/dashing-for-icinga-3-0-0/2523/13 "2021-10-07T10:53:41Z")

</div>

Thank you.

the response looks fine and the relevant data in `num_hosts_up` and `num_hosts_down` should lead to rendering a pie chart with just one colour (it does for me, using the same repository version).

Could you disable every single widget in your `dashboard/icinga2.erb` by commenting them out, except for this one and check if this resolves the problems?

```auto
<li data-row="2" data-col="1" data-sizex="1" data-sizey="1">
      <div
        data-id="doughnut-pie-hosts"
        data-view="Chartjs"
        data-type="doughnut"
        data-title="Hosts"
        data-labels="Up,Down"
        data-colornames="green,red"
        data-datasets="20,13"
        data-height="300"
        data-width="300"
      ></div>
</li>

```

The problem might be due to Dashing rendering too many widgets in the same place, since some of the available widget declarations in `dashboards/icinga2.erb` overlap if you activate them at the same time.

**Edit:** Try reloading the page once after starting dashing. I noticed that upon loading the dashboard the first time after starting the server, the same widget would not get rendered. A refresh did the trick for me.

---

<div class="post-metadata">

**Author:** ![melihoztok](https://community.icinga.com/letter_avatar_proxy/v4/letter/m/71c47a/32.png) [@melihoztok](https://community.icinga.com/u/melihoztok)\
**Post date:** [October 7, 2021, 11:48am UTC](https://community.icinga.com/t/dashing-for-icinga-3-0-0/2523/14 "2021-10-07T11:48:47Z")

</div>

> [@dbodky](#):
>
> `data-datasets="20,13"`

Daniel,

I will try this at nigth. What does it mean "data-datasets=“20,13"” ? Should i change it?

---

<div class="post-metadata">

**Author:** ![dbodky](https://community.icinga.com/user_avatar/community.icinga.com/dbodky/32/4988_2.png) [@dbodky](https://community.icinga.com/u/dbodky)\
**Post date:** [October 7, 2021, 12:01pm UTC](https://community.icinga.com/t/dashing-for-icinga-3-0-0/2523/15 "2021-10-07T12:01:02Z")

</div>

This is a default dataset which is used when you run the dashboard without a valid API backend to query. Basically mock values in order to display an example view. Thanks for trying my suggestions, I would ask you to open an issue over at [https://github.com/mocdaniel/dashing-icinga2](https://github.com/mocdaniel/dashing-icinga2) in case your problems persist afterwards, we had quite a conversation in here already 😃

Best,  
Daniel

---

<div class="post-metadata">

**Author:** ![NiclasE](https://community.icinga.com/letter_avatar_proxy/v4/letter/n/dc4da7/32.png) [@NiclasE](https://community.icinga.com/u/NiclasE)\
**Post date:** [March 27, 2024, 9:36am UTC](https://community.icinga.com/t/dashing-for-icinga-3-0-0/2523/16 "2024-03-27T09:36:25Z")

</div>

First of all… great and simple dashboard.  
I just have a question. Is it possible to alter the queries a bit so for instance I can instead of just showing host up/down base that query on host templates? An example: I have a host template for Windows servers, and another for network snmp devices. I would like to split them in the dashboard so I can see if a window server or network device is down. Is that possible?

---

<div class="post-metadata">

**Author:** ![NiclasE](https://community.icinga.com/letter_avatar_proxy/v4/letter/n/dc4da7/32.png) [@NiclasE](https://community.icinga.com/u/NiclasE)\
**Post date:** [March 27, 2024, 4:42pm UTC](https://community.icinga.com/t/dashing-for-icinga-3-0-0/2523/17 "2024-03-27T16:42:52Z")

</div>

Just noticed I replied to a very old thread… so maybe a Ping @dbodky will help 🙂