Frontend Panel for Diabetics using a Dexcom CGM

[mck165]

thanks for the reply. i saw my error. is there a way to resize it? also, is there a way to adjust the time format? sorry i am a HA novice

[tomx101 (Tomas)]

Make sure you create all supporting templates in templates.yaml (or your config if you’re not splitting templates.yaml). The error above means you have not defined the sensor.dexcom_glucose_status (which is a template showing in range / out of range).

[mck165]

thanks I am trying to paste my template.yaml here but I am not sure how to format it. from what i can tell, everything looks to be correct

[mck165]

[tomx101 (Tomas)]

Everything looks good except the “- sensor:” part. Push that two empty spaces to the right.

Also, make sure you reference this file in your config.yaml. In your case, it should say:
template: !include templates.yaml

[nickrout]

How to help us help you - or How to ask a good question

Before we begin… This forum is not a helpdesk The people here don’t work for Home Assistant, that’s an open source project. We are volunteering our free time to help others. Not all topics may get an answer, never mind one that helps you solve your problem. [image] This also isn’t a general home automation forum, this is a forum for Home Assistant and things related to it. Any question about Home Assistant, and about using things with Home Assistant, is welcome here. We can’t help you with e…

[mck165]

understood

[mck165]

With your help I was able to get rid of all of the errors. There are no errors now, but nothing is displaying on the dashboard. I have all of the icons in the www folder and my config.yaml references the template now. Below is the lovelace yaml

views:
  - title: Home
    cards:
      - type: custom:button-card
entity: sensor.dexcom_arianaeve2015_glucose_value
show_entity_picture: false
show_last_changed: false
show_icon: false
show_name: false
name: |
  [[[ 
     return `<span>${(states['sensor.dexcom_arianaeve2015_glucose_value'].state)} mg/dL</span>`
  ]]]
styles:
  card:
    - border-radius: 2%
    - padding: 2.5%
    - color: ivory
    - font-size: 12px
    - border-width: >
        [[[ if (states['sensor.dexcom_glucose_status'].state === 'In Range')
        return '0px';
            else return '2px';
        ]]]
    - border-color: >
        [[[ if (states['sensor.dexcom_glucose_status'].state === 'Very Low')
        return 'red';
            if (states['sensor.dexcom_glucose_status'].state === 'Low') return 'orange';
            if (states['sensor.dexcom_glucose_status'].state === 'High') return 'orange';
            if (states['sensor.dexcom_glucose_status'].state === 'Very High') return 'red';
            else return 'none';
        ]]]
  grid:
    - grid-template-areas: '"img img" "trend trend" "update update" "range range"'
    - grid-template-columns: 1fr 1fr
    - grid-template-rows: 1fr min-content min-content min-content
  img_cell:
    - justify-content: middle
    - align-items: start
    - margin: none
    - padding-bottom: 5px
  icon:
    - width: 15%
    - margin-top: 0%
    - color: red
    - padding-bottom: 0px
  custom_fields:
    state:
      - align-self: start
      - justify-self: end
      - font-size: 17px
      - padding-bottom: 5px
    update:
      - font-family: helvetica neue, helvetica, Arial
      - font-weight: 500
      - font-size: 15px
      - color: grey
      - align-self: middle
      - justify-content: middle
      - padding-bottom: 5px
      - margin-top: 0px
    trend:
      - font-family: helvetica neue, helvetica, Arial
      - color: rgba(255, 255, 255, 0.7)
      - font-size: 15px
      - font-weight: 300
      - text-align: center
      - padding-bottom: 5px
    range:
      - font-family: helvetica neue, helvetica, Arial
      - font-size: 15px
      - font-weight: 500
      - text-align: center
      - line-height: 30px
      - color: white
      - background-color: |
          [[[
            if ((states['sensor.dexcom_glucose_status'].state === 'Very Low'))
              return "red";
            if ((states['sensor.dexcom_glucose_status'].state === 'Low'))
              return "orange";
            if ((states['sensor.dexcom_glucose_status'].state === 'High'))
              return "orange";
            if ((states['sensor.dexcom_glucose_status'].state === 'Very High'))
              return "red";
            else
              return "none";
          ]]]
    img:
      - font-weight: bold
      - font-size: 15px
      - color: >
          [[[ if (states['sensor.dexcom_glucose_status'].state === 'In Range')
          return 'grey';
              if ((states['sensor.dexcom_glucose_status'].state === 'Low'))
          return "orange";
              if ((states['sensor.dexcom_glucose_status'].state === 'High'))
          return "orange";
              else return 'red';
          ]]]
      - align-self: middle
      - justify-content: middle
      - padding-bottom: 65px
custom_fields:
  trend: |
    [[[ if (states['input_number.dexcom_change'].state > 0)
          return `${(states['sensor.dexcom_arianaeve2015_glucose_trend'].state)} (+${Math.round(states['input_number.dexcom_change'].state)})`;
        return `${(states['sensor.dexcom_arianaeve2015_glucose_trend'].state)} (${Math.round(states['input_number.dexcom_change'].state)})`;
    ]]]
  update: |
    [[[ return `${(states['sensor.dexcom_last_update'].state)}`; ]]]
  range: |
    [[[

      if ((states['sensor.dexcom_glucose_status'].state === 'Very Low'))
        return "VERY LOW";
      if ((states['sensor.dexcom_glucose_status'].state === 'Low'))
        return "LOW";
      if ((states['sensor.dexcom_glucose_status'].state === 'High'))
        return "HIGH";
      if ((states['sensor.dexcom_glucose_status'].state === 'Very High'))
        return "VERY HIGH";
      if ((states['sensor.dexcom_glucose_status'].state === 'In Range'))
        return "IN RANGE";
      else
        return "N/A";
    ]]]
  img: |
    [[[
        if (states['sensor.dexcom_arianaeve2015_glucose_trend'].state == "steady")
          return `<img src=/local/icons/dexcom-steady.png
          style="width: 170px; height: 170px; color: #00def;">
          </ha-icon><span style="font-size:30px; margin-top:-111px; display:block;">${(states['sensor.dexcom_glucose_value'].state)}</span><span style="font-size:13px; margin-top:0px; display:block;">mg/dL</span>`;
        if (states['sensor.dexcom_arianaeve2015_glucose_trend'].state == "rising slightly")
          return `<img src=/local/icons/dexcom-risingslightly.png
          style="width: 170px; height: 170px; color: #00def;">
          </ha-icon><span style="font-size:30px; margin-top:-111px; display:block;">${(states['sensor.dexcom_glucose_value'].state)}</span><span style="font-size:13px; margin-top:0px; display:block;">mg/dL</span>`;
        if (states['sensor.dexcom_arianaeve2015_glucose_trend'].state == "falling slightly")
          return `<img src=/local/icons/dexcom-fallingslightly.png
          style="width: 170px; height: 170px; color: #00def;">
          </ha-icon><span style="font-size:30px; margin-top:-111px; display:block;">${(states['sensor.dexcom_glucose_value'].state)}</span><span style="font-size:13px; margin-top:0px; display:block;">mg/dL</span>`;
        if (states['sensor.dexcom_arianaeve2015_glucose_trend'].state == "falling")
          return `<img src=/local/icons/dexcom-falling.png
          style="width: 170px; height: 170px; color: #00def;">
          </ha-icon><span style="font-size:30px; margin-top:-111px; display:block;">${(states['sensor.dexcom_glucose_value'].state)}</span><span style="font-size:13px; margin-top:0px; display:block;">mg/dL</span>`;
        if (states['sensor.dexcom_arianaeve2015_glucose_trend'].state == "rising")
          return `<img src=/local/icons/dexcom-rising.png
          style="width: 170px; height: 170px; color: #00def;">
          </ha-icon><span style="font-size:30px; margin-top:-111px; display:block;">${(states['sensor.dexcom_glucose_value'].state)}</span><span style="font-size:13px; margin-top:0px; display:block;">mg/dL</span>`;
        if (states['sensor.dexcom_arianaeve2015_glucose_trend'].state == "falling quickly")
          return `<img src=/local/icons/dexcom-fallingquickly1.png
          style="width: 170px; height: 170px; color: #00def;">
          </ha-icon><span style="font-size:30px; margin-top:-111px; display:block;">${(states['sensor.dexcom_glucose_value'].state)}</span><span style="font-size:13px; margin-top:0px; display:block;">mg/dL</span>`;
        if (states['sensor.dexcom_arianaeve2015_glucose_trend'].state == "rising quickly")
          return `<img src=/local/icons/dexcom-risingquickly1.png
          style="width: 170px; height: 170px; color: #00def;">
          </ha-icon><span style="font-size:30px; margin-top:-111px; display:block;">${(states['sensor.dexcom_glucose_value'].state)}</span><span style="font-size:13px; margin-top:0px; display:block;">mg/dL</span>`;
        return `<img src=/local/icons/dexcom-steady.png
          style="width: 170px; height: 170px; color: #00def;">
          </ha-icon><span style="font-size:30px; margin-top:-111px; display:block;">N/A</span><span style="font-size:13px; margin-top:0px; display:block;">mg/dL</span>`;
    ]]]
tap_action:
  action: none

[tomx101 (Tomas)]

@mck165

/local/icons/dexcom-steady.png

This looks fine to me. Are you sure the icons are in /www/icons folder? The path is e.g., www/icons/dexcom-steady.png. That’s the only potential issue I think of.

[mck165]

Thanks and Yes they are in the www. I will keep playing around with it

[wiltodelta (Victor Kuznetsov)]

Update to the latest version, it automatically uses local time settings.

[mck165]

awesome, thank you!

[Bart_Huitsing]

@Bart_Huitsing

type: custom:apexcharts-card
update_interval: 30min
header:
  show: true
  title: Dagelijkse Time-in-Range
  show_states: false
  colorize_states: true
experimental:
  color_threshold: true
graph_span: 1w
span:
  start: week
yaxis:
  - min: 25
    max: 100
apex_config:
  dataLabels:
    enabled: true
  plotOptions:
    bar:
      columnWidth: 60%
  fill:
    opacity: 0.6
  legend:
    show: true
  xaxis:
    type: datetime
    labels:
      datetimeFormatter:
        month: ddd
        day: ddd
  chart:
    height: 300px
  annotations:
    position: back
    yaxis:
      - 'y': 70
        y2: 100
        strokeDashArray: 3
        fillColor: green
        borderColor: '#00000000'
      - 'y': 70
        y2: 50
        strokeDashArray: 3
        fillColor: yellow
        borderColor: '#00000000'
series:
  - entity: sensor.bart_tir_1d
    stroke_width: 1
    type: column
    name: Deze week
    curve: stepline
    extend_to: now
    show:
      legend_value: false
    group_by:
      func: last
      duration: 1d
  - entity: sensor.bart_tir_1d
    stroke_width: 1
    type: column
    name: Vorige week
    curve: stepline
    extend_to: now
    offset: '-1week'
    show:
      legend_value: false
    group_by:
      func: median
      duration: 1d

Apologize for the (very) late reply. The Medtronic provides a TiR sensor. However, I think you could use the MeasureIt integration via HACS to do the same.

[teskanoo]

Thanks. Never too late… I did not know about the Measure It integration. Saved me an extra step in my calculations. I’ll try that out this weekend.

Cheers

[Typ1er (Jens)]

I use the Nightscout integration, where I have the smoothed values with the G7.
How do I reproduce the glucose trend, which is missing in Nigthscout?

[nickrout]

I don’t think you can get that in the nightscout integration, but you can with a rest sensor. I have posted how in another thread. I’m away from home, on holiday, so I’ll try to find the thread.

Edit see Using Continuous Glucose Monitor (CGM) Data - #60 by nickrout

[Thediabeticway (Dave)]

The link to * Dexcom Custom Component This retrieves the BG/Trend data from your Dexcom CGM and creates 2 sensors; one for BG current value, and one for trend direction.

is no longer working!

[Thediabeticway (Dave)]

@CaptainSweatpants

Dexcom Custom Component

I use a R2 ikoolcore so far its been great no lag

[nickrout]

Read the thread. Post 28:

Frontend Panel for Diabetics using a Dexcom CGM

The suggestion of statistics wasn’t in response to you @stevemann The code for the custom component is archived because it is now an official ha integration. The original coder is now the codeowner with ha. I hope he has not gone AWOL - I have three days left on my Freestyle, then trialling dexcom!

[Thediabeticway (Dave)]

Ya, I already have it with Dexcom G6 IN THERE AS WELL I was thinking it was something else with the link not working! I also have Nightscout in Ha just now trying again to see if I can get Sensor Age expired, would really like it to tell me each day how long I have left on my Dexcoms sensor!

I also noticed a bug last night and ended up with high readings due to the Lovelace Card
Add a mini Graph card!

It seems to have kept at my same readings at 6.3mmols for 2 hours and I was 10.5mmols when I looked at the Graph it was correct but Dexcom reading wasn’t!
I looked at Nightscouts and that was also ok at 10.5mmols so I did a right-click and refresh the page and it updated.

I was talking to a Amazon developer at the time and he said it was due to my monitor being an old one and the re-fresh rate is doing it, but I can’t see it doing this for two hours.

I think maybe a few seconds delay or a minute or 2 but not two hours It has been ok today on keeping the correct readings. Been checking it but a little concerned on it now! Hope too I don’t need a new Monitor

How do I get a bigger Blood reading in the Picture element?
seems to be very small!