custom-cards / canvas-gauge-card

The card makes it possible to use gauges from https://canvas-gauges.com/
173 stars 25 forks source link

HA 0.106 - new requirements #17

Closed bmorgan99 closed 4 years ago

bmorgan99 commented 4 years ago

After upgrading to 0.106, I get: "Custom element doesn't exist: canvas-gauge-card."

Details on new custom card changes here: https://developers.home-assistant.io/blog/2020/02/18/106-custom-card-changes/

helto4real commented 4 years ago

Will check it out

helto4real commented 4 years ago

@bmorgan99 can you please test the version by copy the "canvas-gauge-card.js" to the correct place in Home Assistant. Make sure that your browser is not caching by clearing cache.

The fix is here (not merged to the master yet, needs testing) https://github.com/custom-cards/canvas-gauge-card/tree/v106fix

bmorgan99 commented 4 years ago

Didn't work for me. Also updated HA to 106.1

Still get "Custom element doesn't exist: canvas-gauge-card"

rpitera commented 4 years ago

Fixed version doesn't work for me either; details in https://github.com/custom-cards/canvas-gauge-card/issues/18#issuecomment-592760739

joe750927 commented 4 years ago

I have this error after the update: Attempted to assign to readonly property.

plutosherry commented 4 years ago

the same error at HA106.0

plutosherry commented 4 years ago

Thx alots!! The 106fix is okay its worked!! https://github.com/custom-cards/canvas-gauge-card/tree/v106fix

helto4real commented 4 years ago

Thx alots!! The 106fix is okay its worked!! https://github.com/custom-cards/canvas-gauge-card/tree/v106fix

Awesome, thanks for testing!

rpitera commented 4 years ago

@bmorgan99 - make sure you have both the fixed file AND gauge.min.js in the folder. I missed that in my case and that is more than likely the reason for the not found error.

bmorgan99 commented 4 years ago

Just saw that file was missing in my HA log after updating to 106.2 Added it, but now get: Cannot assign to read only property 'borderShadowWidth' of object '#'

Now works with borders True, but not False Cannot add property borderShadowWidth, object is not extensible

helto4real commented 4 years ago

Add it to the yaml file @bmorgan99 . Not the js code. Example from my setup:

      - type: "custom:canvas-gauge-card"
        card_height: 125
        entity: sensor.processor_use
        gauge:
          # colorValueBoxBackground: "#000"
          borderShadowWidth: 0
          borderOuterWidth: 0
          borderMiddleWidth: 0
          borderInnerWidth: 0
          animationDuration: 1500
          animationRule: linear
          borders: false
          colorPlate: "#ddd"
          height: 210
          highlights:
            - color: "rgba(200, 50, 50, .75)"
              from: 80
              to: 100
          majorTicks:
            - "0"
            - "10"
            - "20"
            - "30"
            - "40"
            - "50"
            - "60"
            - "70"
            - "80"
            - "90"
            - "100"
          maxValue: 100
          minValue: 0
          minorTicks: 2
          needleCircleInner: false
          needleCircleOuter: true
          needleCircleSize: 7
          needleType: arrow
          needleWidth: 2
          startAngle: 90
          strokeTicks: true
          ticksAngle: 180
          type: radial-gauge
          valueBox: false
          width: 210
        style:
          left: 4.2%
          top: 9.6%
          transform: none
bmorgan99 commented 4 years ago

Sheesh. Had to close and reopen the browser. Deleting the cache wasn't enough.