custom-cards/canvas-gauge-card

RadialGauge is not supported

dusankeprta opened this issue · 4 comments

dusankeprta commented

Please , could you advice when I am receiving RadialGauge is not supported ?
Initial configuration
- type: custom:canvas-gauge-card
entity: sensor.X.X.X.
card_height: 125
gauge:
type: "radial-gauge"

Thank you

helto4real commented

It should be supported, I am using it my self. Please give som more information about your full config.

rpitera commented

Radial Gauges are supported for sure; I'm using one for a compass and it's working fine. The styling of the card is a bit screwed up now with the last PR (#5) but the compass itself still works. Here's an example:

      - type: custom:canvas-gauge-card
        entity: sensor.wind_compass
        gauge:
          type: "radial-gauge"
          height: 250
          width: 250
          minValue: 0
          maxValue: 360
          majorTicks: ["N", "NE", "E", "SE", "S", "SW", "W", "NW", "N"]
          minorTicks: 22
          ticksAngle: 360
          valueBox: false
          startAngle: 180
          strokeTicks: false
          highlights: false
          colorPlate: "rgba(0,0,0,0.01)"
          colorMajorTicks: "#447BC3"
          colorMinorTicks: "#ddd"
          colorNumbers: "#447BC3"
          colorNeedle: "rgba(240, 128, 128, 1)"
          colorNeedleEnd: "rgba(255, 0, 0, .9)"
          valueTextShadow: false
          colorCircleInner: "#000"
          colorNeedleCircleOuter: "#ccc"
          needleCircleSize: 1
          needleCircleOuter: false
          animationRule: "linear"
          needleType: "line"
          needleStart: 75
          needleEnd: 99
          needleWidth: 3
          borders: true
          borderInnerWidth: 0
          borderMiddleWidth: 0
          borderOuterWidth: 5
          colorBorderOuter: "#447BC3"
          colorBorderOuterEnd: "#447BC3"
          colorNeedleShadowDown: "#222"
          borderShadowWidth: 0
          animationDuration: 1500
AndyAnka commented

I seem to have the same problem. I tried the example code with the compass without any luck.
I have downloaded the two js files in my local folder, defined the resource in my ui Lovelace file.
/Anders

helto4real commented

I use the radial myself. Try the latest version of the js file you find it under latest release (don´t download the one under src. You now require only that file since all dependecies are compiled in one file.